使用Angular在数组中循环数组

时间:2014-06-02 14:27:31

标签: javascript angularjs

使用TODO-app学习Angular。我将这个硬编码数组作为“数据库”,我想在视图中显示任务。

var taskLists = [

    {name: 'Todays todo', id: '1', tasks:['Make coffe', 'another task']},
    {name: 'Tomorrow i will do this', id: '2', tasks:['Code well', 'go to bed']}

];

那么我如何在角度视图中迭代数组内的数组呢? 我试着有两个ng-repeats但是不能让它正常工作。我希望将任务逐个显示为<td>,而不是将整个任务数组显示为一个<td>,就像现在一样['Make coffe','另一个任务']

这就是视图的样子。

<h2 ng-repeat="object in list">{{object.name}}</h2>
<table>
    <thead>
        <tr>Tasks</tr>
    </thead>
    <tr>
        <td ng-repeat="task in list">{{task.tasks}}</td>
    </tr>
</table>

1 个答案:

答案 0 :(得分:2)

你的逻辑有问题。

来自孩子的HTML标签必须在父母内部。

<div class="parent" ng-repeat="object in list">
    <h2>{{object.name}}</h2>
    <table>
        <thead>
            <tr>Tasks</tr>
        </thead>
        <tr ng-repeat="task in object.tasks">
            <td>{{item}}</td>
        </tr>
    </table>
</div>

试试这个并检查它是否有效。