Question

如果我的json看起来像这样

    contactsCtrl.accounts = [
        {
            "id":"7363h33",
            "name":"Red Name",
            "addresses":[
                {
                    "id":"fhdydrtd-2348",
                    "line1":null,
                    "line2":null,
                    "town":null,
                    "county":null,
                    "zipcode":"AL6 TG8"
                }
            ],
            "packages":[
                {
                    "accountId":"234234",
                    "id":"345345-sehwer-wer"

                }
            ],

在我的HTML中

    {{account.name}}

给我正确的名字，

    {{account.packages}}

向我展示了包装的json。我怎样才能获得包中的id。我试过了

    {{account.packages.id}}

Answer 1

我使用{{accounts.packages[0]?.id}}来确保找到正确的值。如果没有?，html会出错，因为它通常不会有[]

Answer 2

你可以对包进行ng-repeat，

 <div ng-repeat="x in accounts">
    <h1>{{ x.name }}</h1>
    <h1>{{ x.phonenumber }}</h1>
     <div ng-repeat="package in x.packages">
     <h2>{{package.id}} </h2>
     </div
  </div>

<强>样本

＆＃13;

var app = angular.module("myApp", []);
app.controller("AccountsController", function($scope) {
 
 $scope.accounts = [
  {
    "id": "7363h33",
    "name": "Red Name",
    "addresses": [
      {
        "id": "fhdydrtd-2348",
        "line1": null,
        "line2": null,
        "town": null,
        "county": null,
        "zipcode": "AL6 TG8"
      }
    ],
    "packages": [
      {
        "accountId": "234234",
        "id": "345345-sehwer-wer"
      }
    ]
  }
];
});

＆＃13;

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body ng-app="myApp" ng-controller="AccountsController">
<table>
  <div ng-repeat="x in accounts">
    <h1>{{ x.name }}</h1>
    <h1>{{ x.phonenumber }}</h1>
     <div ng-repeat="package in x.packages">
     <h2>{{package.id}} </h2>
     </div
  </div>
</table>
</body>
</html>

＆＃13;

页面上json的角度显示值

2 个答案: