使用ng-repeat在Array中的数组

时间:2016-09-03 19:08:49

标签: angularjs angularjs-ng-repeat ng-repeat

任何人都可以帮我解决使用ng-repeat

下面的JSON请求

我想知道如何在HTML中使用ng-repeat来获取JSON中描述的问题

使用下面的代码我得到整个物品的对象

posts.json

    {
  "persons": [
    {
      "properties": {
        "label": "checked",
        "type": "young"
      },
      "personType": "average",
      "troubles": [],
      "externalResourceLinks": []
    },
    {
      "properties": {
        "label": "checked",
        "type": "aged"
      },
      "personType": "bad",
      "troubles": [
        {
          "name": "Rocky",
          "description": "Health problem",
          "criticality": false,
          "date": "2016-08-07T08:43:28+0000",
          "longDate": 1470559408519
        }
      ]
    }
  ]
}
HTML中的

我正在使用

<tr>
<td class="features" ng-repeat="list in person">{{list.persontype}}</td>
</tr>
<tr>
<td class="features" ng-repeat="list in person">{{list.troubles}}</td>
</tr>

角度函数

var app = angular.module('myApp', ["ngTable"]);
app.controller('PostsCtrlAjax', ['$scope', '$http', function($scope, $http) {
        $http({
            method: 'POST',
            url: 'scripts/posts.json'
        }).success(function(data) {
          $scope.post = data;
          persons = data['persons'];
                    $scope.person = persons;
        })
    }

]);

1 个答案:

答案 0 :(得分:1)

你有一系列麻烦,所以根据你的JSON这个例子可以运行:

您的主要模块:

// app.js
(function() {

    angular.module('myApp', ["ngTable"]);

})();

你的控制器:

// PostsCtrlAjax.js
(function() {

    angular.module('myApp').controller('PostsCtrlAjax', PostsCtrlAjax);

    PostsCtrlAjax.$inject = ['$scope', '$http'];

    function PostsCtrlAjax($scope, $http) {

        getPersons();

        function getPersons() {

            $http({
                method: 'POST',
                url: 'scripts/posts.json'
            }).then(function(response) {

                $scope.post = response.data;

            }, function(errors) {

                // any error handling goes here

            });

        }

    }

})();

您的观点:

<!-- your other html here -->

<tr>
    <td class="features" ng-repeat="person in post.persons">{{person.persontype}}</td>
</tr>
<tr>
    <td class="features" ng-repeat="person in post.persons">
        <p ng-repeat="trouble in person.troubles">{{trouble.description}}</p>
    </td>
</tr>

<!-- the rest of your html here -->

我希望你不要介意我整理你的代码,使其更具语义性。