ng-repeat仅显示最后一个值

时间:2017-01-11 15:31:31

标签: angularjs pug ng-repeat

我是Angular的新手,方法ng-repeat是我的问题:

我正在进行测试以学习,这是我现在想要实现的目标:循环表格来显示一些内容

我的问题是:第二次ng-repeat只显示最后一个值。

这是我在控制器中的声明:

app.controller("ClientCtrl", function($scope){
$scope.ClientSections = [
    {title: 'Titre 1', element: 
        [{name: 'Toto', name: 'Contenu 1', name: 'Contenu 2', name: 'Contenu 3'}]
    },
    {title: 'Titre 2', element: 
        [{name: 'Titi', name: 'Contenu 2'}]
    },
    {title: 'Titre 3', element: 
        [{name: 'Titre 1', name: 'Contenu 3'}]
    }
];
});

这是我的哈巴狗模板

element(ng-repeat="ClientSection in ClientSections")
    h2 {{ClientSection.title}}
        item(ng-repeat="Client in ClientSection.element")
            p {{Client.name}}

2 个答案:

答案 0 :(得分:6)

这是因为您的element对象是一个只包含一个json的数组,请将element更新为:

element: 
    [{name: 'Toto'}, {name: 'Contenu 1'}, {name: 'Contenu 2'}, {name: 'Contenu 3'}]

当然,必须对所有对象进行同样的操作。

答案 1 :(得分:5)

您需要关闭大括号

app.controller("ClientCtrl", function($scope){
$scope.ClientSections = [
    {title: 'Titre 1', element: 
        [{name: 'Toto'}, {name: 'Contenu 1'}, {name: 'Contenu 2'}, {name: 'Contenu 3'}]
    },
    {title: 'Titre 2', element: 
        [{name: 'Titi'}, {name: 'Contenu 2'}]
    },
    {title: 'Titre 3', element: 
        [{name: 'Titre 1'}, {name: 'Contenu 3'}]
    }
];