Question

我有一个像这样的Angular $资源：

{
  _id: '1'
  items: [
    {_id: 'a'}, {_id: 'b'}, {_id: 'c'}
  ]
}

我正在尝试构造一个表单，以便items数组中的每个元素都有一个复选框，而act()函数中我可以通过复选框检测该数组的哪些元素被选中

标记类似于：

<form ng-submit="act()">
  <input type="checkbox" ng-model="item._id" ng-repeat="item in items">
  <button type="submit">Submit</button>
</form>

但是，我无法弄清楚如何访问控制器act()函数中已选中复选框所代表的项ID数组。

我已经尝试访问范围中的 FormController ，但似乎无法从那里获取值 - 只有有效状态。我尝试使用ng-model将复选框绑定到作用域中的数组，但act()函数中的复选框始终为空。

Answer 1

您可以动态地为每个项目添加一个名为checked的字段，在您的控制器中，您可以访问$scope.items并过滤掉选中的项目。

<input type="checkbox" ng-model="item.checked" ng-repeat="item in items">

$scope.act = function () {
    var checkedItems = [];
    angular.forEach($scope.items, function (item) {
        if (item.checked !== undefined && item.checked) checkedItems.push(item);
    });
    console.log(checkedItems)
}

的 Working Demo

Answer 2

您可以存储在键是项目ID的对象中检查的值。然后过滤对象以仅返回true（已选中）的值。

示例：http://jsfiddle.net/TheSharpieOne/b3dkU/1/

完全控制器：

function myCtrl($scope){
    $scope.selected = {};
    $scope.var = {
      _id: '1',
      items: [
        {_id: 'a'}, {_id: 'b'}, {_id: 'c'}
      ]
    };
    function isChecked(obj){
        var checked = [];
        for(var key in obj){
            if(obj[key])
                checked.push(key);
        }
        return checked;
    };
    $scope.act = function(){
        $scope.checked = isChecked($scope.selected);
    };
}

从角度控制器功能访问表单输入

2 个答案: