使用ng-repeat時,ng-repeat所在的標籤會被循環生成,例如:spa
<dl ng-repeat="item in [1,2,3,4,5]"> <dt>item : {{item}}</dt> <dd> {{item}} </dd> </dl>
生成的代碼是這樣的:code
<dl class="ng-scope" ng-repeat="item in [1,2,3,4,5]"> <dt class="ng-binding">item : 1</dt> <dd class="ng-binding"> 1 </dd> </dl> <dl class="ng-scope" ng-repeat="item in [1,2,3,4,5]"> <dt class="ng-binding">item : 2</dt> <dd class="ng-binding"> 2 </dd> </dl> <dl class="ng-scope" ng-repeat="item in [1,2,3,4,5]"> <dt class="ng-binding">item : 3</dt> <dd class="ng-binding"> 3 </dd> </dl> <dl class="ng-scope" ng-repeat="item in [1,2,3,4,5]"> <dt class="ng-binding">item : 4</dt> <dd class="ng-binding"> 4 </dd> </dl> <dl class="ng-scope" ng-repeat="item in [1,2,3,4,5]"> <dt class="ng-binding">item : 5</dt> <dd class="ng-binding"> 5 </dd> </dl>
顯然不是我想要的效果,我不想要這麼多的dl標籤。
這時用 ng-repeat-start、ng-repeat-end 能夠解決:blog
<dl> <dt ng-repeat-start="item in [1,2,3,4,5]">item : {{item}}</dt> <dd ng-repeat-end> {{item}} </dd> </dl>
生成的代碼是這樣的:it
<dl> <dt ng-repeat-start="item in [1,2,3,4,5]">item : 1</dt> <dd ng-repeat-end=""> 1 </dd> <dt ng-repeat-start="item in [1,2,3,4,5]">item : 2</dt> <dd ng-repeat-end=""> 2 </dd> <dt ng-repeat-start="item in [1,2,3,4,5]">item : 3</dt> <dd ng-repeat-end=""> 3 </dd> <dt ng-repeat-start="item in [1,2,3,4,5]">item : 4</dt> <dd ng-repeat-end=""> 4 </dd> <dt ng-repeat-start="item in [1,2,3,4,5]">item : 5</dt> <dd ng-repeat-end=""> 5 </dd> </dl>
ng-repeat-start、ng-repeat-end 還能夠用在其它不但願循環外層標籤的場景。也能夠這樣用:class
<dl> <dt>item</dt> <dd ng-repeat-start="item in [1,2,3,4,5]" ng-repeat-end> item :{{item}} </dd> </dl>
這樣就跟使用ng-repeat的效果同樣了。循環