Angular.js ng-repeat跨多個元素
[英]Angular.js ng-repeat across multiple elements
問題描述
這個問題在這里得到了部分解決： Angular.js ng-repeat跨越多個tr
然而，這實際上只是一個解決方案，它實際上並沒有解決核心問題，即：如何在沒有包裝器的情況下跨多個元素使用ng-repeat？
例如，jquery.accordion要求你重復一個h3和div元素，怎么用ng-repeat做呢？
3 個解決方案
解決方案1
157 已采納 2013-06-04 22:49:30
我們現在對此有適當的支持，請參閱：
AngularJs Commmit
有了這個改變，你現在可以做到：
<table>
<tr ng-repeat-start="item in list">
<td>I get repeated</td>
</tr>
<tr ng-repeat-end>
<td>I also get repeated</td>
</tr>
</table>
解決方案2
21 2014-05-16 15:28:55
要回答上面關於表中超過2個ng-repeat級別的Andre的問題，您可以使用多個ng-repeat-start來完成此任務。
<tr ng-repeat-start="items in list">
<td>{{items.title}}</td>
</tr>
<tr ng-repeat-start="item in items">
<td>{{item.subtitle}}</td>
</tr>
<tr ng-repeat-end ng-repeat="value in item.values">
<td>{{value.col1}}</td>
<td>{{value.col2}}</td>
</tr>
<tr ng-repeat-end></tr>
這是一個有關的例子
解決方案3
3 2013-06-03 15:22:04
更新 ：這個答案已經過時了。 請參閱@IgorMinar答案並使用標准ng-repeat-start和ng-repeat-end指令。
有兩種選擇：
第一個選項是創建將呈現多個標簽並替換源標簽的指令（ jsfiddle ）
<div multi ></div> angular.module('components').directive('multi', function ($compile) { return { restrict: 'A', scope : { first : '=', last : '=', }, terminal:true, link: function (scope, element, attrs) { var tmpl = '', arr = [0,1,2,3] // this is instead of your repeater for (var i in arr) { tmpl +='<div>another div</div>' } var newElement = angular.element(tmpl); $compile(newElement)(scope); element.replaceWith(newElement); } })
第二個選項是使用更新的角度源代碼，啟用注釋樣式ngRepeat指令（ plnkr ）
<body ng-controller="MainCtrl"> <div ng-init="arr=[0,1,2]" ></div> <!-- directive: ng-repeat i in arr --> <div>{{i}}</div> <div>{{ 'foo' }}</div> <!-- /ng-repeat --> {{ arr }} <div ng-click="arr.push(arr.length)">add</div> </body>
Angular.js ng-repeat跨越多個tr
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.