[英]how to get row data of a table when input check box will be selected using angular.js
[英]How to get table row data using check box in Angular.js
我需要一個幫助,我需要使用Angular.js從表行中獲取所有檢查的數據。 我在下面解釋我的代碼。
<tr ng-repeat="gl in galleryDatas">
<td><input type="checkbox" name=""> {{$index+1}}</td>
<td><img ng-src="upload/{{gl.image}}" border="0" name="image" style="width:100px; height:100px;" /></td>
<td>{{gl.description}}</td>
</tr>
在這里我需要用戶單擊復選框,相應的行數據將檢索到數組中。請幫助我。
在復選框上使用ng-change
<td><input type="checkbox" ng-change="clickedRow(gl.checked)" name="" ng-model="gl.checked"></td>
在控制器中
$scope.clickedRow = function(checked) {
if (checked) {
//add to the list
} else {
// remove from list
}
}
你可以通過這個過程來實現
在您的控制器中:
$scope.galleryDatas = [
{
name: 'something',
description: "name 1"
},
{
name: 'another',
description: "name 2"
}
];
$scope.checkedValue = [];
$scope.saveInArray = function(index) {
if($scope.galleryDatas[index].checked) {
$scope.checkedValue.push($scope.galleryDatas[index]);
} else {
var newIndex = $scope.checkedValue.map(function(e) { return e.name; }).indexOf($scope.galleryDatas[index].name);
// for compare instead of "name" you should use that field is unique. ie: e.uniqueField
// and $scope.galleryDatas[index].uniqueField
if(newIndex !== -1)
$scope.checkedValue.splice(newIndex,1);
}
};
注意:選中的行數據存儲在$scope.checkedValue
數組中,未選中時則從$scope.checkedValue
數組中刪除
和HTML:
<td><input type="checkbox" ng-model="gl.checked" ng-click="saveInArray($index)"> {{$index+1}}</td>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.