Question

我想对这个json（条目）进行ng-repeat：

[{
  "Entry": {
    "id": "1",
    "title": "Test",
    "person": "Test",
    "description": "Test",
    "created": "2017-07-11 20:19:55",
    "modified": "2017-07-11 20:19:55",
    "date_finished": "2017-07-11 20:19:00",
    "finished": false
  }
}, {
  "Entry": {
    "id": "2",
    "title": "Test 1",
    "person": "Test 1",
    "description": "Test 1",
    "created": "2017-07-11 20:23:02",
    "modified": "2017-07-11 20:23:02",
    "date_finished": "2017-07-11 20:22:00",
    "finished": false
  }
}, {
  "Entry": {
    "id": "3",
    "title": "Test 2",
    "person": "Test 2",
    "description": "Test 2",
    "created": "2017-07-11 20:23:13",
    "modified": "2017-07-11 20:23:13",
    "date_finished": "2017-07-11 20:23:00",
    "finished": false
  }
}]

这就是我获取数据的方式：

public function index() {
    $this->Entry->recursive = 0;
    $this->set('entries', $this->Paginator->paginate());
    $this->set('_serialize', 'entries');
}

这是我的显示代码：

<table class="table">
    <thead>
    <tr>
        <th>Title</th>
        <th>Person</th>
        <th>Description</th>
        <th>Finished Date</th>
    </tr>
    </thead>
    <tbody>
    <tr ng-repeat="entry in entries">
        <td>{{ entry.title }}</td>
        <td>{{ entry.person }}</td>
        <td>{{ entry.description }}</td>
        <td>{{ entry.date_finished }}</td>
    </tr>
    </tbody>
</table>

但是没有输出，所有值都是空的。

json格式好吗？任何建议都会非常有用。

Answer 1

数组的每个对象都包含一个包含数据的Entry对象。

因此，您可能希望更改以下代码：

<tr ng-repeat="entry in entries">
    <td>{{ entry.Entry.title }}</td>
    <td>{{ entry.Entry.person }}</td>
    <td>{{ entry.Entry.description }}</td>
    <td>{{ entry.Entry.date_finished }}</td>
</tr>

作为旁注，重构JSON对象可能是一种更简洁的方式，它将避免每次都复制.Entry。

Answer 2

应该{{1}}而不是entry.Entry.title。如果您没有返回任何其他密钥，则可以删除entry.title密钥。

Answer 3



    angular.module("myApp",[])
    .controller("myController", ['$scope', function($scope){
          $scope.entries = JSON.parse(JSON.stringify({
      "Entry": [{"Entry": {
        "id": "1",
        "title": "Test",
        "person": "Test",
        "description": "Test",
        "created": "2017-07-11 20:19:55",
        "modified": "2017-07-11 20:19:55",
        "date_finished": "2017-07-11 20:19:00",
        "finished": false
      }},{ "Entry":  {
        "id": "2",
        "title": "Test 1",
        "person": "Test 1",
        "description": "Test 1",
        "created": "2017-07-11 20:23:02",
        "modified": "2017-07-11 20:23:02",
        "date_finished": "2017-07-11 20:22:00",
        "finished": false
      }},{"Entry":   {
        "id": "3",
        "title": "Test 2",
        "person": "Test 2",
        "description": "Test 2",
        "created": "2017-07-11 20:23:13",
        "modified": "2017-07-11 20:23:13",
        "date_finished": "2017-07-11 20:23:00",
        "finished": false
      }}]
    }));
    }])
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <html>

        <body ng-app="myApp">
            <div ng-controller="myController">
                <table class="table">
        <thead>
        <tr>
            <th>Title</th>
            <th>Person</th>
            <th>Description</th>
            <th>Finished Date</th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="entry in entries.Entry">
            <td>{{entry.Entry.title}}</td>
            <td>{{entry.Entry.person}}</td>
            <td>{{entry.Entry.description}}</td>
            <td>{{entry.Entry.date_finished}}</td>
        </tr>
        </tbody>
    </table>
            </div>
        </body>
    </html>

AngularJS ng-repeat不显示任何值

3 个答案: