javascript - 当 Knockout JS 中可观察的属性发生变化时执行函数

Question

我有一个演示 application其中所有列表项都是可观察的。为了实现这一点，我在创建列表的数组上使用了映射插件。

this.allItems = ko.mapping.fromJS([
    {name:"Annabelle"},
    {name:"Vertie"},
    {name:"Charles"},
    {name:"John"}
]);

我的问题是 - 如何在 Knockout JS 中正确实现这种行为:每当可观察对象(列表中的任何项目)的属性发生更改时，就会执行排序函数:

    this.sortList = function() {
    this.allItems(this.allItems().sort(function(a, b) { return a.name() > b.name();}).slice(0, 2));
};

Answer 1

首先，您需要声明一个 View 模型类。然后，将 allItems 声明为可观察数组，但向用户显示一个不同的成员，称为“sortedItems”，它应该是一个计算字段。这个计算字段将在内部使用 allItems，因此 KO 会注意到 allItems 何时更新，并且也会重新评估排序的Items。

function AppViewModel() {
var self = this;

this.allItems = ko.observableArray([
    {name:"Annabelle"},
    {name:"Vertie"},
    {name:"Charles"},
    {name:"John"}
]);

    this.sortedItems = ko.computed(function() {
        return self.allItems().sort(sortFunction);
    }, this);
}