如何在角度上显示json列表？答案

【问题标题】：How to display a json list on angular?如何在角度上显示json列表？
【发布时间】：2015-09-25 06:44:38
【问题描述】：

我在 html 中显示 JSON 元素时遇到问题

这是 JSON

peopleList: [
    {
        name: 'John',
        address: 'Street A, 143',
        sons: [{
            First: "Jack",
            Second: "Jane",
            Third: "Maria"
        }]
    }]

这里是html

<div ng-repeat="people in peopleList">
    <span class="">name: {{people.name}}</span><br>
    <span class="">sons: {{people.sons}}</span>
</div>

这个节目儿子：[{“First”：“Jack”，“Second”：“Jane”，“Third”：“Maria”，“_id”：“5604e8e474758451s6d813”}]

我试过用

people.sons.First

但没有显示任何内容

【问题讨论】：

试试这个：{{people[0].sons[0].First}}
ng-repeat="name in names" 和人员是什么？或者，它们是否依赖？

标签： javascript json angularjs

【解决方案1】：

您的 ng-repeat 迭代在我看来有点可疑，请在下方尝试

<div  ng-repeat="name in names">
   <span class="">name: {{name.name}}</span><br>
   <span class="">sons: {{name.sons.First}}</span>

 </div>

如果你想迭代 Sons，那么它可能如下所示

<div  ng-repeat="name in names">
   <span class="">name: {{name.name}}</span><br>
   <span class="" ng-repeat="son in name.sons">
                 sons First: {{son.First}}
                 sons Second: {{son.Second}}                       
                 sons Third: {{son.Third}}                       
    </span>

 </div>

【讨论】：

我觉得应该是name in people
好点！ OP 没有显示他正在使用什么范围变量。我也是这么想的，但只是迭代对象的想法可能会让他找到答案。

【解决方案2】：

你需要的是

{{people.sons[0].First}}

如果您只需要展示第一个儿子。

这是因为您的 sons 属性是一个数组（这有点奇怪 - 这意味着您有第二个 set 儿子？:-)）。 [0] 选择集合，.First 选择 Jack

【讨论】：

我觉得应该是name in people
@Satpal - 谢谢！我认为 OP 似乎更担心儿子部分（结果和试验更多地围绕这一点）
谢谢，帮了大忙

【解决方案3】：

使用

 <span class="">name: {{name.name}}</span><br>
   <span class="">sons: {{name.sons.First}}</span>

【讨论】：

这个我试过了，没用，可能是我语法有错误哈哈

【解决方案4】：

您将names 重复到name，因此如果您在names 中有一个json 数组并且如果您想渲染，请根据您的示例在ng 内的html 中使用name.name name.sons -重复

【讨论】：

嗯，好的，我试试，谢谢！