Javascript 如何在angularjs中使用ng repeat获取嵌套JSON数据_Javascript_Angularjs_Json

Javascript 如何在angularjs中使用ng repeat获取嵌套JSON数据

javascript angularjs json

Javascript 如何在angularjs中使用ng repeat获取嵌套JSON数据,javascript,angularjs,json,Javascript,Angularjs,Json,我正在尝试使用ng repeat获取ng视图中的项目。\ u id值。发生所有数据，但我需要特定数据 data.json [ { _id : "td6v9db4514cc4ewew4334", firstName : 'ayaz', lastName : 'memon', items : '[{"_id":"item2","_name":"My Item #4"}, {"_id":"item3

我正在尝试使用ng repeat获取ng视图中的项目。\ u id值。发生所有数据，但我需要特定数据

data.json

 [ { _id        : "td6v9db4514cc4ewew4334",
     firstName  : 'ayaz',
     lastName   : 'memon',
     items      : '[{"_id":"item2","_name":"My Item #4"},
                    {"_id":"item3","_name":"My Item #4"}]',
     totalItems :  3,
     totalPrice :  2999.97 } ]

控制器

app.controller('myCtrl', function($scope, $http) {
  $http.get("data.json").then((response) => {
    console.log(response.data)

    $scope.userInfo = response.data
  })
})

ng视图

<body ng-app="myApp">

<div ng-controller="myCtrl">
<ul ng-repeat="x in userInfo">
  <li >{{x}}</li>

</ul>

{x}

试试这个

   [{
    "_id": "td6v9db4514cc4ewew4334",
    "firstName": "ayaz",
    "lastName": "memon",
    "items": [{
            "_id": "item2",
            "_name": "My Item #4"
        },
        {
            "_id": "item3",
            "_name": "My Item #4"
        }
    ],
    "totalItems": 3,
    "totalPrice": 2999.97
}]

您可以在ng repeat=“item in userInfo.items”和{item.\u id}中的项目中获得重复的“\u id”

如果有什么错误，请纠正我，我还是新手。

谢谢。

尝试使用嵌套的ng repeat，如下所示：

<ul ng-repeat="user in userInfo">
  <li ng-repeat="x in user.items">{{x._id}} : {{x._name}}</li>
</ul>


{{x.\u id}:{{x.\u name}

我假设您的http调用将返回有效响应，因为您提供的Json数据无效。钥匙需要放在“”内。我还构建了ng repeat，假设您的响应将有多个对象

这里您使用的是userInfo中的嵌套json对象ie项，您可以将ng repeat编写为

<body ng-app="myApp">
<div ng-controller="myCtrl">
<ul>
  <li ng-repeat="x in userInfo.items">{{x._id}}</li>
</ul>



{{x.\u id}

注意：如果您在

中使用ng repeat而不是

这对我来说是有用的，这将很好理解：

<ul>
  <li ng-repeat="user in userInfo">
     <ul>
       {{user._id}}
       <li ng-repeat="item in user.items">
         {{item._id}}
       </li>
     </ul>
  </li>
</ul>




{{user.\u id}}

{{item.\u id}}

Plunker示例：

我试图将字符串作为对象检索，这是一个错误。我使用了对象数据而不是字符串，并得到了结果。

ng repeat=“item in x.items”

将返回每个项。您必须使用嵌套的

ng repeat

。您显示的数据不是有效的JSON。JSON中的键必须被

“

”包围。请检查以下内容的可能重复：

“items”：{“\u id”：“item2”、“\u name”：“我的Item#4”}、{“\u id”：“item3”、“\u name”：“我的Item#4”}，

一个有效的JSON？@Rajesh你说得对，我忽略了它。谢谢你纠正我。当你更改答案时，请检查它的其余部分是否与更新同步。指出这不是嵌套的JSON。@NomanKt就像我前面提到的，这是你的JSON格式，检查一下，我只是更改了你的JSON。只是一个小问题，

userInfo

是一个对象数组，而不是对象数组。是的，我同意你的观点，但它在数组中的单个元素可以像userInfo[0]一样使用，或者它只是一个示例输入，实际数据由n个对象组成。

{x.\u id}
如果我删除.items，它将不起作用，然后它会给我特定的输出，但不会给我items结果。因此，{{item.\u id}
您的JSON数据似乎没有什么问题，因为您可以在我的Plunker示例中看到，我使用了与您相同的对象，并且它工作正常。您找到解决方案了吗？