AngularJS复选框问题

时间:2015-06-13 19:06:23

标签: angularjs

我对angularjs很新,我正在开发一款应用。我的复选框有问题。选中复选框会输出正确的数组元素,但问题是当我取消选中它们时。元素只是将自己添加回数组中。对不起,如果我没有解释自己...我认为需要发生的是从数组中删除所选复选框(如果未选中)。我在某个地方错过了一个循环还是需要添加$ watch?我现在一直试图解决这个问题! 任何建议/帮助将不胜感激。谢谢。

Here is the code:

HTML: This is the select/unselect on table header.

 <td class="checkbox-selector">
                                Select All
                                <input type="checkbox"  
                                       ng-model="selectedAll" 
                                       ng-click="checkAll()">
                            </td>

    ..and the individual checkboxes:



<td>
                            <input type="checkbox" 
                                   class="checkbox-row"
                                   ng-model="result.isSelected"
                                   ng-click="selectedShop(result.shopName, result.ItemId)" />
                            </td>

Angularjs:

 $scope.allSelection = [];

    $scope.checkAll = function() {
        if ($scope.selectedAll) {
            $scope.selectedAll = false;
        } else {
            $scope.selectedAll = true;
        }       
        angular.forEach($scope.results, function (result) {  
            result.isSelected = $scope.selectedAll;  
            $scope.allSelection.push("result.shopName"+"result.itemId");        

            $scope.allSelection=[];

        });
    };


$scope.selection=[];

$scope.selectedShop = function selectedShop(shopName, itemId) {
     $scope.selection.push("shopName"+ "itemId");

};

1 个答案:

答案 0 :(得分:0)

通过调试#checkAll函数,这个问题看起来很简单。

但是一眼就看出,#checkAll的迭代部分出现了错误 - 我认为你的意图是首先清理allSelection(在forEach之外),然后有条件地添加所有项目(如果选择)。

这样的事情:

$scope.checkAll = function() {
    $scope.selectedAll = !$scope.selectedAll;
    $scope.allSelection=[];
    angular.forEach($scope.results, function (result) {  
        result.isSelected = $scope.selectedAll;  
        if ($scope.selectedAll) {
            $scope.allSelection.push(/*whatever needs to be in that array*/);        
        }
    });
}

另一个建议是提取无法正常工作的部分(并且可能在JSFiddle上共享)。