ui網格不會呈現數據

我想顯示我從其他API訪問的表中的數據。我的代碼來實現其計算方法如下：ui網格不會呈現數據

<div ng-controller="AuditorReportController as vm"> 

    <div ui-grid="vm.gridOptions" style="padding-top: 10%;"> 
    </div> 

</div>

控制器：

var vm = this; 
     var i; 
     // activate(); 
     var dataitems; 
     vm.gridOptions = {}; 
     var gridData; 

function userEventData (resp) { 
      $http({ 
       method: "GET", 
       url: resp.results["@href"] 
      }).success(function (responseData) { 
       logger.info("userEventData responseData", responseData); 
       vm.gridOptions.data = responseData; 
       logger.info("gridOptions", vm.gridOptions.data); 
       filterEventField(responseData); 
       //return responseData; 
      }); 
     } 

function populateGrid (responseData) { 
      logger.info("populateGrid function activated"); 
      vm.dateFormat = "medium"; 
      vm.gridOptions = { 
       enableColumnMenus: false, 
       enableColumnResizing: true, 
       enableHorizontalScrollbar: uiGridConstants.scrollbars.WHEN_NEEDED, 
       enableVerticalScrollbar: uiGridConstants.scrollbars.NEVER, 
       enableRowSelection: true, 
       enableSelectAll: true, 
       paginationPageSizes: [10, 20, 30, 40, 50], // Using the same options as old UI 
       paginationPageSize: 20, // Use 20 as the default page size everywhere until user changes it 
       paginationTemplate: "core/templates/ui-grid-pagination-template.html", 
       rowTemplate: gridService.getRowTemplate(), 
       useExternalPagination: true, 
       useExternalSorting: true, 
       columnDefs: [ 
        { 
         field: "sun", 
         displayName: "Init User", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "dun", 
         displayName: "Target User", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "evt", 
         displayName: "Name", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "dip", 
         displayName: "What is affected", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "det", 
         displayName: "Time created", 
         enableHiding: false, 
         allowCellFocus: false 
        } 
       ], 
       /** 
       * @ngdoc function 
       * @name gridApi 
       * @memberof app.alerts.grid.AlertViewsController.populateGrid 
       * @summary 
       * ui grid call back functions 
       */ 
       onRegisterApi: function (gridApi) { 
        vm.gridApi = gridApi; 
       } 

      } 
       vm.gridOptions.totalItems = vm.totalCount; 
     }

有了這個代碼，所有我得到的是一個空表列字段。沒有數據正在顯示。從API返回的數據是按以下格式：

{ 
    "next": { 
    "@href": "https://objects/event?page=2&pagesize=25&field=evt&field=det&field=spt&field=dip&field=dun&field=sun&query=_jobid_.efa2ebf67d479e39d49385D60384E1035B880000C29194FA7" 
    }, 
    "objects": [ 
    { 
     "meta": { 
     "type": "event", 
     "@href": "https://objects/event/1498008581468/49385D60-384E-1035-B44E-000C29194FA7" 
     }, 
     "det": "2017-06-21T01:29:41.468Z", 
     "dip": "12.16.12.18", 
     "spt": "2017-06-21T01:29:41.468Z", 
     "evt": "LoginUser", 
     "dun": "admin", 
     "sun": "admin" 
    }, 
    { 
     "meta": { 
     "type": "event", 
     "@href": "https://objects/event/1498008581439/49385D60-384E-1035-B44C-000C29194FA7" 
     }, 
     "det": "2017-06-21T01:29:41.439Z", 
     "dip": "12.16.12.18", 
     "spt": "2017-06-21T01:29:41.439Z", 
     "evt": "IssueSAMLToken", 
     "dun": "admin", 
     "sun": "admin" 
    }, 
    { 
     "meta": { 
     "type": "event", 
     "@href": "https:/1DEF74E0-376D-1035-AF66-000C29194FA7" 
     }, 
     "det": "2017-06-20T02:16:55.799Z", 
     "dip": "12.16.12.18", 
     "spt": "2017-06-20T02:16:55.799Z", 
     "evt": "LogOffUser", 
     "dun": "admin", 
     "sun": "admin" 
    } 
    ] 
}

我需要格式化數據，它是可讀vm.gridOptions.data？目前，所有我得到的是：

來源

2017-06-21 user2128

確定的響應返回一個數組的一個臨時對象？ vm.gridOptions.data = responseData; 響應被推入上面的變量，但你想要迭代HTML中的同一個變量？ – CrazyMac

是的，我正在遍歷responseData.objects.length。對於（i = 0; i user2128

我沒有看到你的文章中的那段代碼。如果服務器響應是一個數組，那麼你必須迭代angular.forEach（response.data，function（element，index）{vm.gridOptions.push（element）}。然後你可以在你的html中使用vm.gridOptions來迭代。你也應該聲明vm.gridOptions爲array []而不是object {} – CrazyMac

我所要做的就是在populateGrid定義vm.gridOptions（）函數，其中i定義vm.gridOptions對象。我創造，我存儲responseData，然後將其分配給vm.gridOptions.data

function populateGrid() { 
      vm.dateFormat = "medium"; 
      var temp = vm.gridOptions.data; 
      vm.gridOptions = { 
       enableColumnMenus: false, 
       enableColumnResizing: true, 
       enableHorizontalScrollbar: uiGridConstants.scrollbars.WHEN_NEEDED, 
       enableVerticalScrollbar: uiGridConstants.scrollbars.NEVER, 
       enableRowSelection: true, 
       enableSelectAll: true, 
       paginationPageSizes: [10, 20, 30, 40, 50], // Using the same options as old UI 
       paginationPageSize: 20, // Use 20 as the default page size everywhere until user changes it 
       paginationTemplate: "core/templates/ui-grid-pagination-template.html", 
       rowTemplate: gridService.getRowTemplate(), 
       useExternalPagination: true, 
       useExternalSorting: true, 
       columnDefs: [ 
        { 
         field: "sun", 
         displayName: "Init User", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "dun", 
         displayName: "Target User", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "evt", 
         displayName: "Name", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "dip", 
         displayName: "What is affected", 
         enableHiding: false, 
         allowCellFocus: false 
        }, 
        { 
         field: "det", 
         displayName: "Time created", 
         enableHiding: false, 
         allowCellFocus: false 
        } 
       ], 
       /** 
       * @ngdoc function 
       * @name gridApi 
       * @memberof app.alerts.grid.AlertViewsController.populateGrid 
       * @summary 
       * ui grid call back functions 
       */ 
       onRegisterApi: function (gridApi) { 
        vm.gridApi = gridApi; 
       } 

      } 
       vm.gridOptions.totalItems = vm.totalCount; 
       vm.gridOptions.data = temp.objects; 
     }

來源

2017-06-21 06:16:17 user2128

ui網格不會呈現數據

回答

相關問題