javascript - Knockout.JS:从模型到 View 的不同值

Question

我正在使用 KnockoutJS 并且我有一个输入控件，它显示我的模型中的一个数字。

一切正常，但我想在输入控件中显示之前格式化我的数字 - 但我想将它作为数字保留在我的 View 中!因此，假设我有以下代码:

<td><input class='requiredNum' type='text' data-bind="value: testNum"></input></td>

我有一个函数 toText() 可以将数字转换为我需要的数字。但是，这不起作用:

<td><input class='requiredNum' type='text' data-bind="value: toText(testNum)"></input></td>

我能理解问题是 Knockoutjs 不知道如何做相反的事情(从文本转换为数字)——但这对我来说不是问题，因为我已经用另一种方式处理了。

你能给我推荐一个解决方案吗？

Answer 1

最简单的解决方案是使用 writeable dependentObservable .

var viewModel = {
    number: ko.observable(10)
};

viewModel.formattedNumber = ko.dependentObservable({
  read: function() {
     //do formatting on this.number() here
     return this.number().toFixed(4);
  },
  write: function(newValue) {
     //take user input and parse into a number
     this.number(parseFloat(newValue));
  },
  owner: viewModel
});

样本: http://jsfiddle.net/rniemeyer/8bsAF/