Question

我有这种类型的json对象：

[
    {
        "contactsCount": 2,
        "id": 1,
        "userKey": "$2a$10$3jCL8.rJV9/KS11MtrB4r.0uE4Fu/rGwEk.ko0HTkzFNiKXhh1.X.",
        "groupname": "Angular",
        "createdAt": "2018-01-15T07:21:42.000Z",
        "updatedAt": "2018-01-15T07:21:42.000Z",
        "contactgroups": [
            {
                "id": 1,
                "contact": {
                    "id": 1,
                    "gsm": "111111111",
                    "firstname": "Mohamed",
                    "lastname": "Sameer"
                }
            },
            {
                "id": 3,
                "contact": {
                    "id": 3,
                    "gsm": "222222222",
                    "firstname": "Rizwan",
                    "lastname": "Riz"
                }
            }
        ]
    }
]

我在 $ scope.modalData 中得到了这个。

我必须在表格中显示我的gsm，名字和姓氏：

我的玉代码：

table.table
tr
 th GSM
 th First Name
 th Last Name

tr(ng-repeat='testData in modalData.contactgroups[0]')
 td {{testData.gsm}} 
 td {{testData.firstname}}
 td {{testData.lastname}}

任何人都帮助我，我没有得到数据，有人能解释我该怎么做吗？

当用户点击另一个表中的编辑按钮时，我收到此响应：

$scope.modalData = {};
    $scope.setModal = function (data) {
        $scope.modalData = data;
        console.log($scope.modalData);
    }




Jade:
    td
      a(data-toggle='modal',ng-click='setModal(groups[$index])' ) Groups

Answer 1

您必须从[0]中删除ng-repeat，然后才能获得实际数组由于您在contact对象下有这些值，因此必须使用对象和属性名称填充。像，

tr(ng-repeat='testData in modalData.contactgroups')
 td {{testData.contact.gsm}} 
 td {{testData.contact.firstname}}
 td {{testData.contact.lastname}}

Answer 2

＆＃13;

<!DOCTYPE html>
<html ng-app="app">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Example</title>
    <script data-require="angular.js@1.4.x" src="https://code.angularjs.org/1.4.3/angular.js" data-semver="1.4.3"></script>
    <script>
      var app = angular.module('app', []);
      app.controller('MainCtrl', function($scope) {
        $scope.items = [
    {
        "contactsCount": 2,
        "id": 1,
        "userKey": "$2a$10$3jCL8.rJV9/KS11MtrB4r.0uE4Fu/rGwEk.ko0HTkzFNiKXhh1.X.",
        "groupname": "Angular",
        "createdAt": "2018-01-15T07:21:42.000Z",
        "updatedAt": "2018-01-15T07:21:42.000Z",
        "contactgroups": [
            {
                "id": 1,
                "contact": {
                    "id": 1,
                    "gsm": "111111111",
                    "firstname": "Mohamed",
                    "lastname": "Sameer"
                }
            },
            {
                "id": 3,
                "contact": {
                    "id": 3,
                    "gsm": "222222222",
                    "firstname": "Rizwan",
                    "lastname": "Riz"
                }
            }
        ]
    }
]
      });
    </script>
  </head>
  <body ng-controller="MainCtrl">
    <table>
      <tr ng-repeat="item in items[0].contactgroups">
        <td ng-repeat="i in item">{{i.gsm}}</td>
        <td ng-repeat="i in item">{{i.firstname}}</td>
        <td ng-repeat="i in item">{{i.lastname}}</td>
      </tr>
    </table>
  </body>
</html>

＆＃13;

使用ng-repeat AngularJs显示数据

2 个答案: