淘汰赛自定义绑定在更新前获取值答案

【问题标题】：Knockout custom binding get value before update淘汰赛自定义绑定在更新前获取值
【发布时间】：2015-04-14 13:32:56
【问题描述】：

我有一个自定义绑定，它已经实现了更新。

我想知道调用 update 之前的值是多少。我看不到它被传递到任何参数中。我错过了吗？

    ko.bindingHandlers.ticker= {
        update: function (element, valueAccessor, allBindingsAccessor) {
            var toNumber = ko.utils.unwrapObservable(valueAccessor());
            var fromNumber = 0; //<---- can i set this to the old value?

            var counter = new Ticker(element, fromNumber, toNumber);

            counter.start();
        }
    }

目前我正在从 0 计数到值（这只是在 UI 中进行动画处理），但我希望能够从旧值计数到新值，而不是将其重置为 0，然后从那里计数。

【问题讨论】：

我不相信它被传入了。也许您可以将它作为属性存储在元素上，这样下次update 运行时它仍然存在？
应该没问题，因为您有 jQuery 类型的插件绑定处理程序之类的东西，可以更新 update 上元素上的插件选项
另外，因为你在绑定中创建了一个新的Ticker()，你实际上和ko.components对viewModel提供的函数所做的一样，但缺点是你之后无法访问 JS 属性。尽管这种方法是完全有效的，但对我来说，将 all 模型数据存储在 JS 中，而不是内部 DOM 属性，似乎更符合 MV* 模式。

标签： knockout.js custom-binding

【解决方案1】：

有两种方法可以做到这一点：

1) 使用ko.utils.domData API 将一些数据与您的元素一起存储。

// Read previous data
var prevData = ko.utils.domData.get(element, 'dataKey');
var newData = 42;

// Remember data for next time update is called
ko.utils.domData.set(element, 'dataKey', newData);

2) 根本不使用更新。您对更新所做的一切也可以通过计算订阅或简单订阅来完成。

ko.bindingHandlers.ticker = {
    init: function (element, valueAccessor, allBindingsAccessor) {
        var toNumber = ko.utils.unwrapObservable(valueAccessor());
        var fromNumber = 0;        

        function startTicker(toNumber) {
            var counter = new Ticker(element, fromNumber, toNumber);
            counter.start();
            fromNumber = toNumber;
        }

        ko.computed(function () {
            startTicker(toNumber);
        }, null, { disposeWhenNodeIsRemoved: element });
    }
}

请注意，如果您的 dom 节点被删除，计算将被安全地处理。

【讨论】：

【解决方案2】：

假设ticker 会将元素值从fromNumber 更新为toNumber，您可以将其实现为可观察对象，然后使用text 绑定来更新元素。如果ticker 纯粹用于UI，并且它的状态不应该反映在模型中，那么考虑使用valueAccessor() 的对象而不是observable，以这种方式获取from 和to。

如果还需要原始状态，也可以使用绑定的init来获取原始值。

【讨论】：