来自json的角度ngTableParams

时间:2015-11-12 21:43:56

标签: json angularjs django ngtable

从json数据创建表时遇到问题。

使用Django + AngularJS

不显示数据。

tables.js

app.controller('tableCtrl', function(ngTableParams, tableData) {
    var data = tableData
    this.tableLatestContests = new ngTableParams({
        page: 1,
        count: 5,
    }, {
        total: data.length,
        getData: function($defer, params) {
            $defer.resolve(data.slice((params.page() - 1) * params.count(), params.page() * params.count())); 
        }
    }
});

services.js

app.service('tableData', [$resource, function($resource) {
    this.data = $resouce('data/table.json', {}, {
        query: {
            method: 'GET',
            isArray: true,
        }
    }
});

data/table.json

[
    {"id": 1, "market": "name", "uid": "uid"},
    {"id": 2, "market": "name2", "uid": "uid2"},
]

table.html(由于django语法,应用已将{{& }}更改为//& //

<div class="card-body card-padding" data-ng-controller="tableCtrl as tctrl">
    <table ng-table="tctrl.tableLastestContests" class="table table-striped table-vmiddle">
        <tr ng-repeat="w in $data">
            <td data-title="'ID'"> // w.id // </td>
            <td data-title="'MARKET'"> // w.market // </td>
            <td data-title="'UID'"> // w.uid // </td>
        </tr>
     </table>
 </div> 

如何阅读和显示来自json的tada表?

1 个答案:

答案 0 :(得分:0)

你误会了什么。 $ resource创建服务实例,而不是从服务获取数据。这就是为什么你有能够从json而不是json的数据形式获取数据的服务。

this.srv = $resouce('data/table.json', {}, {
    query: {
        method: 'GET',
        isArray: true,
    }
}
this.data = this.srv.query();

成功加载后,您将获得this.data中的数据。

当然,您可以将最后一行更改为以下内容:

var _self = this;
this.srv.query(function(response) {
    _self.data = response;
});

如果您不想创建服务,可以执行以下操作:

$http.get('data/table.json').then(function(response) {
    _self.data = response.data;
});

我的帖子不包括对错误的支持。

您可以在这里阅读更多内容:

https://docs.angularjs.org/api/ngResource/service/$resource https://docs.angularjs.org/api/ng/service/$http

此外,您在视图中有错误。在data中使用$data代替ng-repeat