Question

我正在创建一个用户表，我想在每行添加一个复选框和一个删除按钮。当我单击删除按钮时，我想删除所有被选中的用户。

现在，我正在通过API响应创建这些用户条目，这会给我说id，姓名和电子邮件。

所以我的观点看起来像这样：

<tr ng-repeat="user in MyCntrl.data.users track by $index">
     <td><input type="checkbox"></td>
     <td>{{user.name}}</td>
     <td>{{user.email}}</td>
</tr>

我想在控制器中想要的是一个对象，其id为所有点击该复选框的用户。

即使我创建了一个对象并将其指定为复选框的模型，如何在该对象中添加一个键作为id？

Answer 1

您可以执行<input type="checkbox" ng-model="user.isSelected">

然后只为那些有MyCntrl.data.users

的人过滤isSelected === true

Answer 2

由于JavaScript动态类型性质，没有什么能阻止您向模型添加名为“isSelected”（或类似）的字段。然后，您可以将ng-model="user.isSelected"添加到checkbox标记中。然后，在删除时，检查哪些条目isSelected设置为true并删除它们。

Answer 3

以下是如何跟踪另一个阵列中所有选定用户的示例：

示例： Plunker

<tr ng-repeat="user in MyCntrl.data.users track by $index">
     <td><input type="checkbox" ng-model="tempVar" ng-click="toggleSelection($index)"></td>
     <td>{{user.name}}</td>
     <td>{{user.email}}</td>
</tr>

<!-- AngularJS Code -->
<script type="text/javascript">
var app = angular.module('myApp', []);

app.controller('MyCtrl', function($scope) {
  $scope.selectedUsers = []; // initially the selected users array is empty 
  $scope.toggleSelection = function(index){
    var positionInSelectedArray;
    var arr = $scope.MyCntrl.data.users;
    var tempUser = arr[index]; // refers to the selected user object in $scope.MyCntrl.data.users array (further, we'll call it "arr")


    var userAlreadySelected = $scope.selectedUsers.filter(function( obj ) {
      return obj.userId == tempUser.userId;
    })[0]; //checks whether the user is already selected or not (if selected, then returns the user object)
    if (angular.isUndefined(userAlreadySelected)) {
         $scope.selectedUsers.push(tempUser); //insert the object in array containing selected users
    }else{
        positionInSelectedArray = $scope.selectedUsers.indexOf(userAlreadySelected);
        $scope.selectedUsers.splice(positionInSelectedArray, 1); //removes the user object from array containing selected users
    }
  };
});
</script>

如何为角度中动态创建的复选框定义模型

3 个答案: