Question

有人可以帮助我。我想用ui-grid实现数据显示。但是，当我使用带有<tr ng-repeat="transaction in savingaccountdetails.transactions>数据的表时，网格不显示仅显示空白的数据。

我想使用ui-grid，因为能够在滚动大数据的同时拥有固定的标题但是很难使表头固定，大多数时候列不对齐。我尝试了大多数情况但没有按预期工作。

我的代码如下： -

var columnsUiGrid = [
                { displayName: 'Value Date', field: 'accountdetails.transactions.date'},
                { displayName: 'Seq', field: 'accountdetails.transactions.id'},
                { displayName: 'Number', field: 'accountdetails.transactions.transactionCode'},
                { displayName: 'Type', field: 'accountdetails.transactions.transactionCode'},
                { displayName: 'Debit', field: 'accountdetails.transactions.amount'},
                { displayName: 'Credit', field: 'accountdetails.transactions.amount'},
                { displayName: 'Balance', field: 'accountdetails.transactions.runningBalance'},
                { displayName: 'Tlr#', field: 'accountdetails.transactions.teller'},
                { displayName: 'Reference', field: 'accountdetails.transactions.referenceCode'},
                { displayName: 'Description', field: 'accountdetails.transactions.description'}
            ];
            scope.gridOptions = {
                columnDefs: columnsUiGrid,
                enableSorting: false,
                enableColumnMenus: false,
                enableRowSelection: true,
                enableRowHeaderSelection : false,
                multiSelect: false,
                data: 'accountdetails'
            };

resourceFactory.savingsResource.get({accountId: routeParams.id, associations: 'all'}, function (data) {
                scope.accountdetails = data;
            });

从上面我从网页浏览器控制台收到以下错误： - 当我使用引号，即'accountdetails'时，我得到以下错误： -

angular.js:9400 TypeError: d.$applyAsync is not a function
    at h (http://localhost:9000/bower_components/angular-ui-grid/ui-grid.min.js:7:2757)
    at post (http://localhost:9000/bower_components/angular-ui-grid/ui-grid.min.js:7:4152)
    at http://localhost:9000/bower_components/angular/angular.js:6602:44
    at nodeLinkFn (http://localhost:9000/bower_components/angular/angular.js:6224:13)
    at http://localhost:9000/bower_components/angular/angular.js:6414:13
    at http://localhost:9000/bower_components/angular/angular.js:7559:11
    at wrappedCallback (http://localhost:9000/bower_components/angular/angular.js:10930:81)
    at http://localhost:9000/bower_components/angular/angular.js:11016:26
    at Scope.$eval (http://localhost:9000/bower_components/angular/angular.js:11936:28)
    at Scope.$digest (http://localhost:9000/bower_components/angular/angular.js:11762:31) <div ui-i18n="en" class="influxGrid ui-grid ng-isolate-scope grid1505208757076" id="transactionGrid" ui-grid-selection="" ui-grid="gridOptions" style="height: 340px;">
(anonymous) @ angular.js:9400
(anonymous) @ angular.js:6836
nodeLinkFn @ angular.js:6227
(anonymous) @ angular.js:6414
(anonymous) @ angular.js:7559
wrappedCallback @ angular.js:10930
(anonymous) @ angular.js:11016
$eval @ angular.js:11936
$digest @ angular.js:11762
$apply @ angular.js:12042
(anonymous) @ angular.js:13575
completeOutstandingRequest @ angular.js:4109
(anonymous) @ angular.js:4416
angular.js:9400 TypeError: b.forEach is not a function
    at p.modifyRows (ui-grid.min.js:7)
    at ui-grid.min.js:7
    at wrappedCallback (angular.js:10930)
    at angular.js:11016
    at Scope.$eval (angular.js:11936)
    at Scope.$digest (angular.js:11762)
    at Scope.$apply (angular.js:12042)
    at angular.js:13575
    at completeOutstandingRequest (angular.js:4109)
    at angular.js:4416

Answer 1

我真的不知道为什么你将范围用作“范围”而不是“$ scope”。我不知道你的问题出在哪里，但也许你会以这种方式尝试你的代码：

var columnsUiGrid = [
            { displayName: 'Value Date', field: 'accountdetails.transactions.date'},
            { displayName: 'Seq', field: 'accountdetails.transactions.id'},
            { displayName: 'Number', field: 'accountdetails.transactions.transactionCode'},
            { displayName: 'Type', field: 'accountdetails.transactions.transactionCode'},
            { displayName: 'Debit', field: 'accountdetails.transactions.amount'},
            { displayName: 'Credit', field: 'accountdetails.transactions.amount'},
            { displayName: 'Balance', field: 'accountdetails.transactions.runningBalance'},
            { displayName: 'Tlr#', field: 'accountdetails.transactions.teller'},
            { displayName: 'Reference', field: 'accountdetails.transactions.referenceCode'},
            { displayName: 'Description', field: 'accountdetails.transactions.description'}
        ];
        $scope.gridOptions = {
            columnDefs: columnsUiGrid,
            enableSorting: false,
            enableColumnMenus: false,
            enableRowSelection: true,
            enableRowHeaderSelection : false,
            multiSelect: false,
            data: $scope.accountdetails
        };
resourceFactory.savingsResource.get({accountId: routeParams.id, associations: 'all'}, function (data) {
                $scope.accountdetails = data;
            });

请告诉我们有关您问题的更多详情

ui-grid没有显示数据angularjs

1 个答案: