Angular JS在无序列表中重复2个数组

时间:2016-05-01 20:47:23

标签: javascript arrays angularjs

我得到了这个HTML:

 <ul class="demo-list-three mdl-list">
    <li class="mdl-list__item mdl-list__item--three-line" ng-repeat="p in projects">
        <span class="mdl-list__item-primary-content">
            <i class="material-icons mdl-list__item-avatar">person</i>
            <span>{{p}}</span>
            <span class="mdl-list__item-text-body">
                {{descriptions[0]}}
            </span>
        </span>
        <span class="mdl-list__item-secondary-content">
            <a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
        </span>
    </li>
</ul>

项目和说明是我的控制器中的数组。现在我正在为Project Array中的每个项目获取一个listitem,但是我如何迭代描述呢?

就像在第一次迭代中一样:

<span>{{descriptions[0]}}</span>

在下一个项目中下一个p的迭代中:

<span>{{descriptions[1]}}</span>

谢谢!

1 个答案:

答案 0 :(得分:2)

在ng-repeat

中使用track by
<ul class="demo-list-three mdl-list">
    <li class="mdl-list__item mdl-list__item--three-line" ng-repeat="p in projects track by $index">
        <span class="mdl-list__item-primary-content">
            <i class="material-icons mdl-list__item-avatar">person</i>
            <span>{{p}}</span>
            <span class="mdl-list__item-text-body">
                {{descriptions[$index]}}
            </span>
        </span>
        <span class="mdl-list__item-secondary-content">
            <a class="mdl-list__item-secondary-action" href="#"><i class="material-icons">star</i></a>
        </span>
    </li>
</ul>