在KnockoutJs中对可观察数组排序时UI不更新

UI not updating when sorting observable array in KnockoutJs

本文关键字：UI 更新 数组排序 观察 KnockoutJs      更新时间：2023-09-26

我面临的问题，当我排序可观察数组，数组得到更新，但不改变UI

代码:

模型代码: 

function OrderByOptionModel(field, displayText, isSelected, dispIndex) {
    var self = this;
    self.field = field;
    self.dispText = displayText;
    self.isSelected = ko.observable(isSelected);
    self.dispIndex = dispIndex;
    self.click = function (data) {
        if (data == null) return;
        data.isSelected(!data.isSelected());
    };
    self.getOrderByOptions = function () {
        return [
            new OrderByOptionModel(OrderByTypes.INDUSTRY, 'Industry', false, 1),
            new OrderByOptionModel(OrderByTypes.SUPERSECTOR, 'Super Sector', false, 2),
            new OrderByOptionModel(OrderByTypes.SECTOR, 'Sector', false, 3),
            new OrderByOptionModel(OrderByTypes.SUBSECTOR, 'Sub Sector', false, 4),
            new OrderByOptionModel(OrderByTypes.COUNTRY, 'Country', false, 5),
            new OrderByOptionModel(OrderByTypes.MARKETCAP, 'Market Cap', false, 6),
            new OrderByOptionModel(OrderByTypes.ATOZ, 'A - Z', false, 7),
            new OrderByOptionModel(OrderByTypes.DATETIME, 'Date Time', false, 8)
        ];
    };
    return self;
}

可观测的数组:

self.orderByOptions = ko.observableArray(OrderByOptionModel().getOrderByOptions());

排序代码:

 self.orderByOptions().sort(function (l, r) {
             return l.dispIndex > r.dispIndex ? 1 : -1;
        });

但是UI没有得到更新，我不知道问题在哪里?

去掉observableArray赋值中的圆括号。

self.orderByOptions = ko.observableArray(OrderByOptionModel().getOrderByOptions);

knockout的问题是，当将东西绑定到可观察对象时，它会代表你调用函数。有时，只需删除返回数据的函数的括号并绑定到函数本身就可以修复它。

相关文章：