[英]How to add a manual cell in each table row after an ng-repeat?
我正在建立一個表,該表由ng-repeat填充,並遍歷了來自數據庫的列表。 這部分工作正常,但是我想有一個復選框,允許用戶選擇刪除哪些行。 我還想在表頭上有一個復選框,用作全選按鈕。
問題是,據我所知,ng-repeat循環包含有問題的行內的所有內容,使我無法在循環和行的末尾之間插入手動單元格。
有沒有一種方法可以在循環和行尾之間添加額外的單元格,例如使用ng-repeat-start和ng-repeat end?
這是我嘗試的一個例子。 顯然,這沒有用。
<table>
<tr><th ng-repeat=" e in poistoavaimet">{{e}}</th></tr>
<tr ng-repeat="i in poistolista | filter:sukunimiVal | filter:etunimiVal">
<td ng-repeat-start=" key in poistoavaimet">{{i[key]}}</td>
<td ng-repeat-end>
<input type="checkbox" ng-model="poistovalinta.{{$index}}">
{{$index}}</input>
</td>
</tr>
</table>
poistoavaimet包含從數組中提取的鍵。 Poistolista是從中提取密鑰的數組本身,其中包含來自數據庫的數據。 Poistovalinta是復選框值的變量。 poistovalinta.{{$index}}
試圖在poistovalinta -array中創建一個具有行索引鍵的條目。
我將添加一段代碼,負責處理來自控制器的這些變量:
$scope.haePoistettavat = function(){
$http.get('/opiskelijahaku', {params: {'optio':2}})
.then(function(res){
$scope.poistolista = res.data.message;
$scope.poistoavaimet = Object.keys($scope.poistolista[0]);
$scope.adminLista = {};
$scope.adminLista['poisto'] = true;
}, function(error){
console.log(error)
});
}
此函數將帶有一個選項的http get發送到服務器,該選項告訴服務器返回正確的列表。 響應存儲在$scope.poistolista
,密鑰提取到數組$scope.poistoavaimet
。 $scope.adminLista
包含true / false值,這些值鏈接到多個對象中的ng-show。 當時的想法是只顯示其中之一。 這與問題沒有直接聯系。
感謝@RaphaMex消除了我對ng-repeat的誤解!
解決方案正是他所說的。 只需在重復后添加單元格即可。
這是固定版本:
<table>
<tr><th ng-repeat=" e in poistoavaimet">{{e}}</th><th><input id="kaikki" type="checkbox" ng-model="kaikkiVal"></th></tr>
<tr ng-repeat="i in poistolista | filter:sukunimiVal | filter:etunimiVal">
<td ng-repeat=" key in poistoavaimet">{{i[key]}}</td>
<td><input type="checkbox" ng-model="poistovalinta"></td>
</tr>
</table>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.