淘汰赛JS更新颜色(Knockout JS Update Color)

2019-09-17 05:44发布

我使用的是淘汰赛观测到更新位于表单元格内的跨度值。 我需要改变表格单元格的背景颜色,当新值与旧值不同。 看来当我订阅可观察我没有在更新过程中获得的旧值。 有没有办法让旧值? 我正打算更新使用CSS可观察的状态结合的表单元格背景。

<td data-bind="css: { tempIncreased: tempState() > 0 }">
    <span data-bind="text: temp"></span>
</td>

在视图模型:

   this.temp.subscribe(function (newValue) {
        var old = this.temp();
        if (newValue > old) {
            this.tempState = 1;
        }
        else {
            this.tempState = 0;
        }
    }, this);

Answer 1:

淘汰赛2.0加入一个主题订阅观测的能力。 该“beforeChange”主题将为您提供以前的值。

有了这个,你可以扩展观测添加订阅,同时提供新旧价值观回调。

它可能看起来像:

ko.observable.fn.beforeAndAfterSubscribe = function(callback, target) {
    var _oldValue;
    this.subscribe(function(oldValue) {
        _oldValue = oldValue;
    }, null, 'beforeChange');

    this.subscribe(function(newValue) {
        callback.call(target, _oldValue, newValue);
    });
};

您可以添加此功能ko.subscribable.fn而非ko.observable.fn能够为两个计算和正常观测做到这一点。

你可以使用此类似:

this.temp.beforeAndAfterSubscribe(function (oldValue, newValue) {
    if (newValue > oldValue) {
        this.tempState = 1;
    }
    else {
        this.tempState = 0;
    }
}, this);

下面是一个示例: http://jsfiddle.net/rniemeyer/QDbUk/



文章来源: Knockout JS Update Color
标签: knockout.js