在尝试了几个小时的想法后，我无法将其付诸实践。
简单需要：我有一个文本框(INPUT类型TEXT)和一个Div标签：
<body>
<input id="tb" type="text"/>
<div id="Words" data-bind="text: WordCount"></div>
</body>
理想情况下，我只想在每次用户在tb文本框中键入新字符时更新WordCount。
为了做到这一点，我创建了一个ViewModel:
function ViewModel() {
var self = this;
self.recalcFlag = ko.observable();
self.WordCount = ko.computed(function () {
self.recalcFlag();
return CountWords($("#tb").wijinputtext("option", "text"))
}, this);
self.recalcWordCount = function () {
self.recalcFlag.notifySubscribers();
}
}
我使用的CountWords函数如下所示：
function CountWords(inputString) {
var splitArray = inputString.split(" "), obj = {};
for (var x = 0; x < splitArray.length; x++) {
if (obj[splitArray[x]] === undefined) {
obj[splitArray[x]] = 1;
} else {
obj[splitArray[x]]++;
}
}
return splitArray.length;
}
上面的技术是我在另一篇SO文章中看到的解决方案——一种获得计算的ko值以按需刷新/更新的方法。这个想法是通过按键函数调用recalcWordCount。但问题是，我的recalcWordCount函数在ViewModel对象中，而Knockout已经创建了一个实例。我不知道如何访问ko的ViewModel实例来调用该函数。例如，这不起作用：
<input id="tb" type="text" onkeypress="recalcWordCount();" />
此外，这也不起作用：
<input id="tb" type="text" onkeypress="ViewModel.recalcWordCount();" />
此外，这也不起作用：
<input id="tb" type="text" onkeypress="ko.viewModel.recalcWordCount();" />
如果能给我什么建议，我将不胜感激。
您可以添加一个可观察的"过滤器"，并将其与如下输入绑定：
<input data-bind="value: filter, valueUpdate: 'afterkeydown'" />
然后在计算的"WordCount"中使用可观察到的
self.WordCount = ko.computed(function () {
var filter = this.filter();
return CountWords(filter)
}, this);