我想运行使用ng-table角度模块的最基本方案: http://ng-table.com/#/ 我的代码:
<div ng-controller="View2Ctrl as vm">
<table ng-table="vm.tableParams" class="table table-striped" show-filter="true">
<tr ng-repeat="row in $data">
<td title="'Id'" filter="{ id: 'number'}" sortable="'id'">
{{row.id}}</td>
<td title="'Name'" filter="{ name: 'text'}" sortable="'name'">
{{row.name}}</td>
</tr>
</table>
</div>
'use strict';
angular.module('myApp.view2', ['ngRoute', 'ngTable'])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/view2', {
templateUrl: 'view2/view2.html',
controller: 'View2Ctrl'
});
}])
.controller('View2Ctrl', ['ngTableParams', function(ngTableParams) {
var self = this;
self.tableParams = new ngTableParams({}, { dataset: itemsGlobal2});
}]);
var itemsGlobal2 = [
{"id":1,"name":"name 1","description":"description 1","field3":"field3 1","field4":"field4 1","field5 ":"field5 1"},
{"id":2,"name":"name 2","description":"description 1","field3":"field3 2","field4":"field4 2","field5 ":"field5 2"},
{"id":3,"name":"name 3","description":"description 1","field3":"field3 3","field4":"field4 3","field5 ":"field5 3"},
{"id":4,"name":"name 4","description":"description 1","field3":"field3 4","field4":"field4 4","field5 ":"field5 4"},
{"id":5,"name":"name 5","description":"description 1","field3":"field3 5","field4":"field4 5","field5 ":"field5 5"},
{"id":6,"name":"name 6","description":"description 1","field3":"field3 6","field4":"field4 6","field5 ":"field5 6"},
{"id":7,"name":"name 7","description":"description 1","field3":"field3 7","field4":"field4 7","field5 ":"field5 7"}
];
我尝试将数组分配给数据集属性(静态地,如链接示例中所示)。结果 - 表未加载任何数据。无论如何我无法让它工作。 然后我看了一下不是来自项目网页的使用示例,我找不到任何使用该方法静态设置'dataset'属性的方法。所以我没有这样做,而是开始使用getData()函数,我刚刚返回静态数组。之后,它开始显示我的数据:)更改:
.controller('View2Ctrl', ['ngTableParams', function(ngTableParams) {
var self = this;
self.tableParams = new ngTableParams({
page: 1,
count: 10
}, {
total: itemsGlobal2.length,
getData: function($defer, params) {
self.items = itemsGlobal2;
params.total(self.items);
$defer.resolve(self.items);
}
});
}]);
但还有另一个问题。表的功能都没有工作(没有分页,没有过滤,没有排序)。
我只是试图在他们的网页上使用最简单的场景,我花了整整一天时间做这件事而且仍然无法正常工作......我做错了什么,或者代码或文档中是否有任何错误?
答案 0 :(得分:0)
我在ng-table中加载静态数据时遇到了同样的问题(顺便说一句,我使用的是v0.8.3)。记录/打印tableParams
后,我发现它使用data
代替dataset
。
因此,在您的示例中,您可以尝试以下方法吗?
.controller('View2Ctrl', ['ngTableParams', function(ngTableParams) {
var self = this;
self.tableParams = new ngTableParams({}, { data: itemsGlobal2});
}]);