javascript - 按值删除元素 a-la Knockout

Question

这是一个由两部分组成的问题，与在 Angular 中操作数据数组中的元素有关。从 ViewModel 中的数组中删除元素的方法似乎非常普遍:

$scope.array.splice(index, 1);

这对我来说似乎有点不稳定，我更喜欢 Knockout 处理这个问题的方式 with .remove and observable arrays :vm.array.remove(item)。

我发现你可以这样做，效果更好一点:

$scope.array.splice($scope.array.indexOf(item), 1);

但它更详细，并且 .indexOf 可能无法按您的预期工作，具体取决于 item 是什么。

Angular 是否有任何构造可以让您轻松地通过值从数组中删除项目？

同样基于this video from Egghead.io ，删除 ViewModel 方法内的依赖项而不依赖范围是有意义的。是否最好传递您要从中删除项目的数组:

<input type=submit ng-click="remove(array, item)">
array.splice(array.indexOf(item), 1)

或者是否有理由更喜欢在删除方法中使用$scope(或 Controller )？

Answer 1

不幸或幸运的是，Knockout 的做法与我们使用 Angular 的方式相同，即 splice 方法

如果你查看knockout库中observableArray.remove(item)的源代码 -

 'remove': function (valueOrPredicate) {
        var underlyingArray = this.peek();
        var removedValues = [];
        var predicate = typeof valueOrPredicate == "function" && !ko.isObservable(valueOrPredicate) ? valueOrPredicate : function (value) { return value === valueOrPredicate; };
        for (var i = 0; i < underlyingArray.length; i++) {
            var value = underlyingArray[i];
            if (predicate(value)) {
                if (removedValues.length === 0) {
                    this.valueWillMutate();
                }
                removedValues.push(value);
                underlyingArray.splice(i, 1);
                i--;
            }
        }
        if (removedValues.length) {
            this.valueHasMutated();
        }
        return removedValues;
    }

它做同样的事情，它解析数组并比较给定的值并执行拼接。

他们为此编写了可重用的模块，以方便开发人员使用。我相信您可以通过在 Angular 代码中编写自定义指令来实现相同的目的。您可以使用上面的代码作为引用。只是 Angular 没有任何可重用的指令......但是......也许我们可以在发出请求后请求拉取请求:-)

但是你的问题很好，应该有这样一个可重用的模块。