使用.splice從數組中刪除項目是刪除多個對象

Question

我創建了一個用戶可以選擇/取消選擇員工的頁面。 我正在使用.push將這些員工添加到數組users 。 我也使用.splice從數組中刪除未經檢查的項目。 目前，取消選中上次檢查的項目可以正常工作，但是，如果我選擇多個項目並取消選中視圖中顯示的第一個項目，它將從陣列中刪除每個項目。

這是HTML：

<div ng-app="myApp">
  <div ng-controller="MainCtrl">
    <table>
      <tr ng-repeat="user in users">
        <td><input type="checkbox" ng-model="checked" ng-change="addremoveuser(checked, user.ID)"><td>
        <td>{{user.Title}}</td>
        <td>{{user.FirstName}}</td>
        <td>{{user.LastName}}</td>
      </tr>
    </table>
  </div>
</div>

這是JS：

var app = angular.module('myApp', ['ngSanitize']);
app.controller('MainCtrl', function($scope, $http, $q){
    var users = [];
    $scope.addremoveuser = function (checked, id) {
        if (checked) {
            console.log("user selected", id);
            users.push(id)
            console.log("if test", users);
        }
        else {
            console.log("user unselected", id);
            var index = users.indexOf(id);
            users.splice(index);
            console.log("else test", users);
        }
    };
});

如何解決此問題僅刪除未選中的項目？

Answer 1

users.splice(index);

應該：

users.splice(index, 1);

看看文檔：

方法Array.splice（）

另外，要注意id是什么。 它是一個病態的命名元素還是數組中元素的實際id ？ 如果它在數組中的元素的id你不需要indexOf(id) 。

Answer 2

拼接和改變數組有點危險。 幫助添加/刪除用戶的一種策略是簡單地使用filter 。

var users = [];
$scope.addremoveuser = function (checked, id) {
    if (checked) {
        console.log("user selected", id);
        users.push(id)
        console.log("if test", users);
    }
    else {
        console.log("user unselected", id);
        users = users.filter(function(user) {
          return user.id === id;
        }
        console.log("else test", users);
    }