在淘汰计算访问器上订阅 arrayChange

Question

我有一个案例，我需要监听一个计算的数组变化，它只是返回一个可观察的过滤值。 但是，我确实需要完整的更改列表，就像 .subscribe(function(changes){},null,'arrayChange') 对 observableArray 所做的那样。

我的理解是 arrayChange 在计算值的情况下不起作用，因为它可能会重新制作一个新数组，因此列表没有具体的变化。

完整示例请参见http://jsfiddle.net/darknessm0404/A6D8u/1/。

// The following does not work, but I'd like it
computedTest.subscribe(function(changesList){
    console.log('COMPUTED subscription : arrayChange');
}, null, 'arrayChange');

我似乎实现我想要的唯一方法是创建另一个可观察数组，该数组将根据更改进行推送/删除，这样我就可以让“arrayChange”方法工作。

我的想法的完整示例：

this.events.listFiltered = ko.observableArray().extend({ rateLimit: 0 });
this.events.listFiltered_Worker = ko.computed(function () {
    var listFiltered = me.events.listFiltered();

    ko.utils.arrayForEach(me.events.list(), function (item) {
            index = listFiltered.indexOf(item);
        if (FILTERING_CASE_HERE) {
            if (index < 0) {
                listFiltered.push(item);
            }
        } else if (index >= 0) { // Delete
            listFiltered.splice(index, 1);
        }
    });
    return ko.utils.arrayFilter(me.events.list(), function (item) {
        return !(item.end().isBefore(filterStart) || item.start().isAfter(filterEnd));
    });
    return __rd++;
}).extend({ rateLimit: 0 });
this.events.listFiltered.subscribe(function () {
    debug('inside subscribe');
    debugger;
}, null, 'arrayChange');

但是我想知道是否有更简单的解决方案来解决这个问题？

Answer 1

Knockout 支持任何 observable 的 arrayChange，您必须专门启用它。

var computedTest = ko.computed(function() {  
    ...
}).extend({trackArrayChanges: true});

http://jsfiddle.net/mbest/A6D8u/2/

如果您查看 Knockout 源代码，this is what's done 会自动用于可观察数组。

如果这是您项目中的常见场景，您可以创建一个包装函数来执行此操作：

function computedArray() {
    return ko.computed.apply(ko, arguments).extend({trackArrayChanges: true});
}