2015-08-24 52 views
1

我正在學習使用Angular。我試圖從數組中刪除選中的對象,但它們都沒有被刪除。這裏是我的代碼,無法一次刪除所有檢查的對象

<body ng-app="myApp"> 

    <div ng-controller="myController"> 
    [<a href="" ng-click="remove()">remove</a>] 
    <ul> 
     <li ng-repeat="user in users"> 
      <input type="checkbox" ng-model="user.checked"/> 
      {{user.name}} 
     </li> 
    </ul> 
    </div> 

    <script> 
    var myApp = angular.module('myApp', []); 
    myApp.controller('myController', function($scope){ 

     $scope.users = [ 
      {name:'John Smith', checked: false}, 
      {name: 'John Doe', checked: false}, 
      {name: 'Jane Doe', checked: false}, 
      {name:'Marry Jane', checked: false}   
     ]; 

     $scope.remove = function(){ 
      $scope.users.forEach(function(user){ 
       if(user.checked){ 
        var index = $scope.users.indexOf(user); 
        $scope.users.splice(index, 1); 
       } 
      }); 
     };  

    }); 
    </script> 
</body>  

*注意:http://plnkr.co/edit/uBD74w5ywiadlPcML4Cz?p=preview

我不知道什麼是錯的代碼。我真的需要幫助。

謝謝。

回答

0

您可以刪除通過減少這樣的:

$scope.remove = function(){ 
    $scope.users = $scope.users.reduce(function(previousValue, currentValue){ 
    if(!currentValue.checked){ 
     previousValue.push(currentValue); 
    } 
    return previousValue; 
    },[]); 
}; 
1

正如您從用戶數組項,數組的變化和forEach循環就無法正常工作你的預期;因爲您的原始數組在每次刪除操作後都會更改

使用數組的過濾器功能可以正確地完成您的工作。

$scope.remove = function(){ 
    $scope.users = $scope.users.filter(function(user){ 
     return !user.checked; 
    }); 
};  

Plunker

+0

請注意,這個答案有瀏覽器要求:FF 1.5和IE 9 – Icycool