拼接数组时的奇怪行为，javascript

Question

我正在使用复选框列表，并且我有下一个逻辑行为：

1. 如果选中所有项目，则选中“全选”复选框
2. 如果未选中所有选定项目之一，则复选框“全选”也未选中

这个逻辑很清楚。取决于检查的项目，我将其 id 提取到一个附加数组，然后使用该数组请求获取数据。

对于推动一切正常，但对于切片逻辑很奇怪。所以我可以对数组进行切片，直到第一个项目被选中，但是我取消选中第一个项目，推送和切片项目不再与复选框相关。

我已经用它复制了plunker，所以如果有人能帮助我找到我所缺少的东西，我将不胜感激。

  $scope.modelClass = {
        selectedAll: false
        };

$scope.selectAllClass = function (array) {
     angular.forEach(array, function (item) {
            item.selected = $scope.modelClass.selectedAll;

            $scope.param =''

         });
    };

$scope.checkIfAllClassSelected = function (array) {
     $scope.modelClass.selectedAll = array.every(function (item) {
           return item.selected == true
        });
     $scope.checked = array.filter(function (item) {
           return item.selected == true
        }).length;

     angular.forEach(array, function (obj) {
           if(obj.selected == true){
                requestClass(obj)
            }
       });
   };

   var selectedClass = [];
   var requestClass = function (obj) {

         selectedClass.push(obj);

         angular.forEach(selectedClass, function (val) {
                 if (val.selected != true) {
                      selectedClass.splice(selectedClass.indexOf(val.id), 1);
                 }
                 else {
                      selectedClass = selectedClass.filter(function (elem, index, self) {
                             return index == self.indexOf(elem);
                     })
                 }
            });

          $scope.param = _.map(selectedClass, 'id')
     };




  $scope.classes = [
           {"id":4,"name":"Achievement","selected":false},
           {"id":13,"name":"Information","selected":false},
           {"id":6,"name":"Issue","selected":false},
           {"id":5,"name":"Message","selected":false},
           {"id":9,"name":"Request","selected":false}
           ]

Answer 1

逻辑对我来说看起来不错，不确定这里有什么问题。我从post 中获取了第一个解决方案（看起来您正在使用第二个），并根据您的需要对其进行了一些修改。

$scope.model = {
    selectedClass : []
}

$scope.isSelectAll = function(){
    $scope.model.selectedClass = [];

        if($scope.master){
            $scope.master = true;

          for(var i=0;i<$scope.classes.length;i++){
                        $scope.model.selectedClass.push($scope.classes[i].id);      
                    }
                }
      else{
        $scope.master = false;
      }

   angular.forEach($scope.classes, function (item) {
            item.selected = $scope.master;
   });

   $scope.param = $scope.model.selectedClass
}

$scope.isChecked = function()   {

            var id = this.item.id;

            if(this.item.selected){

                $scope.model.selectedClass.push(id);

                if($scope.model.selectedClass.length == $scope.classes.length ){$scope.master = true;

                }
            }  else  {
                $scope.master = false;

                var index = $scope.model.selectedClass.indexOf(id);

                $scope.model.selectedClass.splice(index, 1);
            }

        $scope.param = $scope.model.selectedClass
    }  


$scope.classes = [
           {"id":4,"name":"Achievement","selected":false},
           {"id":13,"name":"Information","selected":false},
           {"id":6,"name":"Issue","selected":false},
           {"id":5,"name":"Message","selected":false},
           {"id":9,"name":"Request","selected":false}
    ]

html

<div ng-class="{'selected': master, 'default': !master}">
   <div>
      <input type="checkbox" ng-model="master" ng-change="isSelectAll()" > Select all
   </div>
</div>
<div ng-repeat="item in classes | orderBy : 'id'" ng-class="{'selected': item.selected, 'default': !item.selected}">
   <div >
     <input type="checkbox" ng-model="item.selected" ng-change="isChecked()">
         {{ item.name }}
     </div>
</div>

这是固定的plunker