Knockout js 中的 IValueConverter 是否有替代方案？答案

【问题标题】：Is there an alternative to the IValueConverter in Knockout js?Knockout js 中的 IValueConverter 是否有替代方案？
【发布时间】：2012-10-01 19:59:18
【问题描述】：

首先，我知道你可以使用 Computed observables。它们非常适合复杂的属性，但 IMO 不是您在 Silverlight 中拥有的 IValueConverters 的一个值得替代品。在我当前的项目中，我有多个日期选择器。现在，我必须为每个日期创建一个额外的计算 observable，因为我希望格式化工作。因此，如果我有 5 个日期，即 10 个属性，那么在 Silverlight 中您将有 5 个日期和 1 个通用日期转换器。

它可以工作，但它不是很干净的代码。更不用说在对这些日期应用验证时遇到的问题了。

有没有类似的东西：

<input type="text" data-bind="value: TestProperty" data-converter="MyTextConverter" />

或者有什么替代方法不能让我创建双重属性？

提前致谢，

阿恩·德鲁韦

【问题讨论】：

标签： knockout.js

【解决方案1】：

您正在寻找custom-binding 的主要用途。在这里查看good guide

ko.bindingHandlers.dateConverter = {
  init: function (element, valueAccessor, allBindingsAccessor) {
    var underlyingObservable = valueAccessor();
    var options = allBindingsAccessor().dateConverterOptions
                    || { /* set defaults here */ };

    var interceptor = ko.computed({
      read: function() {
        return underlyingObservable();
      },

      write: function(newValue) {
        var current = underlyingObservable(),
            convertedDate;

        /* do some kind of conversion here, using the 'options' object passed */

        if (convertedDate !== current) {
          underlyingObservable(convertedDate);
        }
        else if (newValue !== current.toString()) {
          underlyingObservable.valueHasMutated();
        }
      }
    });

      ko.applyBindingsToNode(element, { value: interceptor });
  }
};

拦截器代码修改自here

编辑：

你的 html 看起来像：

<input type="text"
       data-bind="dateConverter: TestProperty,
                  dateConverterOptions: { format: 'dd/mm/yyyy', anotherOption: 'example' } " />

【讨论】：

正是我所需要的，谢谢！一件小事，你应该删除 else if 下的右括号，因为你有一个太多。再次感谢您的快速响应！
很高兴我能帮上忙！抱歉，是的，我实际上添加了一个括号，因为我认为最好将您的块括起来，例如 if(...) { ... } 而不是 if(...) ...，因为它提高了可读性并便于以后添加代码