angularjs – 我如何使用angular渲染动态定义列表?

前端之家收集整理的这篇文章主要介绍了angularjs – 我如何使用angular渲染动态定义列表?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何使用angular渲染动态定义列表?

例:

数据:

[
    {
        key: 'a',value: 'x'
    },{
        key: 'b',value: 'y'
    }
]

所需HTML:

<dl>
    <dt>a</dt>
    <dd>x</dd>
    <dt>b</dt>
    <dd>y</dd>
</dl>

示例在http://docs.angularjs.org/tutorial/step_08

<dl>
    <dt>Availability</dt>
    <dd ng-repeat="availability in phone.availability">{{availability}}</dd>
</dl>

适用于动态dd数和静态dts数,但不是两者的动态数。

在Angular 1.2中添加了允许ng-repeat-start / ng-repeat-end的新功能

有了这个功能,你可以这样写你的html:

<dl>
  <dt ng-repeat-start="i in items">{{i.key}}</dt>
  <dd ng-repeat-end>{{i.value}}</dd>
</dl>

有关完整的工作示例,请参见this plnkr

原文链接:https://www.f2er.com/angularjs/146848.html

猜你在找的Angularjs相关文章