阵列拼接只能按一个顺序进行

Question

我有一点问题。 我有一个用于显示div的复选框。 我可以从6个不同的复选框中进行选择，以选择要显示的div。

选中复选框时，我显示div并发送到服务器的div选中名称。

 $scope.savesGraphUserDetail = [];
    $scope.addRemoveUserChart = function(checked, value) {
      if (checked) {
        $scope.savesGraphUserDetail.push(value);

        var config = { headers: { "Content-Type": "application/x-www-form-urlencoded", "X-HTTP-Method-Override": "PUT" } };
        var data = {graphsConfig: $scope.savesGraphUserDetail};

        $http
        .post(serviceBase + "blabla", data, config)
          .success(function(data, status, headers, config) {
          })
          .error(function(data, status, header, config) {
          });
      }else {
        var index = $scope.savesGraphUserDetail.indexOf(value);
        $scope.savesGraphUserDetail.splice(index);

        var config = { headers: { "Content-Type": "application/x-www-form-urlencoded", "X-HTTP-Method-Override": "PUT" } };
        var data = {graphsConfig: $scope.savesGraphUserDetail};

        $http
          .post(serviceBase + "blabla", data, config)
          .success(function(data, status, headers, config) {
          })
          .error(function(data, status, header, config) {
          });
      }

没关系，但是当我取消选中复选框时会遇到问题，因为如果我按此顺序进行检查，请首先单击“ A”，第二个“ C”和第三个“ D”，这样将数组推入

myArray = ["A", "C", "D"]

如果我以相反的顺序取消选中，请先取消选中“ D”

myArray = ["A", "C"]

第二次取消选中“ C”

myArray = ["A"]

最后一个“ A”

myArray = []

这是完美的，但是如果我取消选中复选框时更改顺序

myArray = ["A", "C", "D"]

如果我先取消选中“ C”，我的数组删除“ C”和“ D”，我得到这个

myArray = ["A"]

如果我先取消选中“ A”，我的数组删除“ A”和“ C”和“ D”，我得到这个

myArray = []

如何删除唯一未选中的项目？

Answer 1

您需要指定Array#splice的deleteCount ，因为没有删除所有以实际索引开头的元素。

参数

deleteCount _可选

一个整数，指示要删除的旧数组元素的数量。 如果deleteCount为0，则不会删除任何元素。 在这种情况下，您应该至少指定一个新元素。 如果deleteCount大于从start的数组中剩余的元素数，则将删除数组末尾的所有元素。

如果省略deleteCount ，或者其值大于array.length - start ，则将从start index start直到数组结尾的所有元素都将被删除。

$scope.savesGraphUserDetail.splice(index, 1);
//                                        ^

Answer 2

您的问题是您仅使用index调用.splice()方法 ，需要将1分隔为第二个参数，这是要拼接的项目数，即deleteCount可选参数。

var index = $scope.savesGraphUserDetail.indexOf(value);
$scope.savesGraphUserDetail.splice(index, 1);

否则，将从开始索引到数组末尾的所有元素都将被删除，这就是为什么在第二次尝试中删除"C"和"D"的原因。

文档：

如果查看.splice() MDN规范 ，可以看到：