Question

我有以下代码：

<li ng-repeat="item in items">
    <a href="#" ng-if="!item.children" ng-click="checkItem(item,checkBoxModel)">
        <input class="align"
               ng-click="checkItem(item,checkBoxModel)"
               type="checkbox" ng-checked="master"
               ng-model="checkboxModel"/>     
                 {{ item.title }}                 
     </a>
</li>

在我的控制器中我有checkItem功能：

$scope.checkItem = function(item, checkBoxModel) {
    if (checkBoxModel == undefined || checkBoxModel == true) {
        ....        
        $scope.master=true;
        $scope.checkBoxModel = false;*
    } else {
        ....
        $scope.master = false;
        $scope.checkBoxModel = true;
    }
}

问题是，当我点击链接时，会检查所有复选框。我只想检查与链接相关的复选框。

Answer 1

更改您的应用逻辑。您必须为每个项目声明一个变量。但是正如我所看到的，在名为$scope的全局master中，您可以拥有一个。应该为每个项目声明主文件以指定选项框的状态。然后你的问题就会解决。

这样的事情：

<强> app.js

$scope.items = [
    {
        name: 'example',
        master: false,
        checkboxModel: false
    },
    {
        name: 'example',
        master: false,
        checkboxModel: false
    }
];

$scope.checkItem = function(item, checkBoxModel) {
    if (checkBoxModel == undefined || checkBoxModel == true) {
        ....        
        $scope.items[item].master = true;
        ...
    } else {
        ....
        $scope.items[item].master = false;
        ...
    }
}

<强>的index.html

<input class="align"
                   ng-click="checkItem(item, checkBoxModel)"
                   type="checkbox" ng-checked="item.master"
                   ng-model="item.checkboxModel"/>

Answer 2

不是在控制器master对象上设置值$scope，而是在传入的实际项目上设置它，并将其设置为ng-checked="item.master"并且它是ng-model="item.checkBoxModel" < / p>

$scope.checkItem = function(item, checkBoxModel) {
    if (checkBoxModel == undefined || checkBoxModel == true) {
        ....        
        item.master=true;
        item.checkBoxModel = false;
    } else {
        ....
        item.master = false;
        item.checkBoxModel = true;
    }
}

Answer 3

<li ng-repeat="item in items">
<a href="#" ng-if="!item.children" ng-click="checkItem(item)">
    <input class="align"
           ng-click="checkItem(item)"
           type="checkbox" ng-checked="item.checked"
          />     
             {{ item.title }}                 
 </a>

在我的控制器中，我更改了item.checked的值

单击angularJs中的链接选中一个复选框

3 个答案: