使用ngRepeat指令循環時生成多個標籤

我知道ngRepeat和forEach，但我需要的或多或少是這兩者的混合。我的意思是以下內容：使用ngRepeat指令循環時生成多個標籤

我有一列$scope中的列。我可以用

<th ng-repeat="col in columns">{{ col.label }}</th>

這將使

<th>Col A</th> 
<th>Col B</th> 
<th>Col C</th>

在$scope我有一個變量（mode）。當此變量的值爲admin時，某些與管理員相關的html標記將使用ng-show顯示。此外，當這個變量是admin我想我的專欄中呈現這樣

<th>config</th> 
<th>Col A</th> 
<th>config</th> 
<th>Col B</th> 
<th>config</th> 
<th>Col C</th>

有沒有辦法以某種方式使用ng-repeat，這樣我可以呈現在同一時間的配置和標籤欄？也許類似

<repeat for="col in columns"> 
    <th ng-show="mode == 'admin'">config</th> 
    <th>{{ col.label }}</th> 
</repeat>

或者是我創建已經具有管理員列，並得到再生一個新的列表（forEach）每mode時間唯一的選擇是改變了嗎？對此最好的方法是什麼？

來源

2017-06-01 Pablo

您是否嘗試過使用'ng-show'或'ng-if'在div中包裝''元素？ – DevlshOne

@DevlshOne這不是有效的HTML。 – charlietfl

除非你的配置和列是相同長度的數組，否則我不會看到如何在不首先映射控制器中的數據的情況下做到這一點。使用示例數據創建一個plunker演示 – charlietfl

您可以使用給一個試試功能NG-重複啓動和NG-重複端。像這樣：

<div ng-repeat-start="foo in foos">{{ foo.something }}</div> 
    Anything in here 
    <div><div ng-repeat-end="">This code will repeat and should work</div> 
    </div>

有關更多信息，請參閱https://docs.angularjs.org/api/ng/directive/ngRepeat。

來源

2017-06-01 04:25:30

謝謝，我錯過了文檔中的那一部分。我在查找使用示例，並快速向下滾動頁面，而無需查看文檔中的其他詳細信息。 – Pablo

隨時隨地。大多數情況下都是這樣。如果您需要任何幫助，請隨時與我聯繫。 –

最好使用返回列

$scope.getColumns = function() { 
    if (mode != 'admin') { 
    return columns; 
    } else { 
    var c = new Array(columns.length * 2); 
    for (var i=0; i< c.length; i++) { 
     c[i] = i % 2 == 0 ? 'config' : columns[parseInt(i/2)]; 
    } 
    return c; 
    } 
}

模板

<th ng-repeat="column in getColumns()" ng-bind="column"></th>

來源

2017-06-01 03:25:43

謝謝你的建議。實際上，在我的代碼中，我使用了一個類似你的函數，因爲我需要過濾掉一些列。我的問題是關於'ngRepeat'的更一般的問題，這就是爲什麼我在這裏使用'column in column'而不是'getColumns（）'中的列。 – Pablo

使用ngRepeat指令循環時生成多個標籤

回答

相關問題