当使用休息服务输出分配完全相同的数据时,ng-table分组不起作用

时间:2014-09-12 15:04:40

标签: json angularjs ngtable

我正面临一个有趣的问题。当输入数据被硬编码时,ng-table组正常工作,这与来自休息服务json的数据相同。
在硬编码的json下面工作:

var data = [{name: "Moroni", age: 50, role: 'Administrator'},
            {name: "Tiancum", age: 43, role: 'Administrator'},
            {name: "Jacob", age: 27, role: 'Administrator'},
            {name: "Nephi", age: 29, role: 'Moderator'},
            {name: "Enos", age: 34, role: 'User'},
            {name: "Tiancum", age: 43, role: 'User'},              
            {name: "Enos", age: 34, role: 'User'}];


这不起作用

 var data = response;

我调试了响应,它与我的硬编码json数据完全相同。我无法弄清问题是什么。

我已经看过ng-table文档并遵循相同的原则。我的html和js代码类似于 - http://bazalt-cms.com/ng-table/example/13

我的代码与上面的示例13链接完全相似。我正在呼叫服务并获取类似数据。 (Plunker link - http://plnkr.co/edit/becd3D

我仍面临同样的问题。任何人都可以帮忙。

请帮忙。感谢

2 个答案:

答案 0 :(得分:1)

请参阅此处http://plnkr.co/edit/fsNx1h?p=preview

从服务器获取数据后,只需将$ scope.tableParams移动到回调函数中。

 $http.get('data.json').then(function(response){
   var data = response.data
    $scope.tableParams = new ngTableParams({
        page: 1,            // show first page
        count: 10          // count per page
    }, {
        groupBy: function(item) {
            return 'First letter "' + item.name[0] + '"';
        },
        total: data.length,
        getData: function($defer, params) {

            var orderedData = params.sorting() ?
                    $filter('orderBy')(data, $scope.tableParams.orderBy()) :
                    data;

            $defer.resolve(orderedData.slice((params.page() - 1) * params.count(), params.page() * params.count()));
        }
    });

    });
})

答案 1 :(得分:0)

我会尽量避免使用“仅链接”类型的答案,但这是如此做作,我觉得很难理解自己,更不用说解释它了。

网站上给出的示例没有使用任何类型的回调,不知道是否是错误。

以下是我的进展方式:

  • 网站上有一个示例,显示AJAX加载到ngTable。
  • 还有另一个示例显示如何对数据进行分组。
我把他们混在了一起。这是一个working demo

据我所知,整个getData函数需要将所有内容组合在一起,无论是异步还是硬编码。所以你必须传递数据,但是一些配置参数:

getData: function($defer, params) {

    // ajax request to api
    Api.get(params.url(), function(data) {
        $timeout(function() {

            // update table params
            params.total(data.total);

            // set new data
            $defer.resolve(data.result);

        }, 500);
    });
}