Question

Durandal Startkit模板不包含已实现的搜索（即可）。它可能具有的是一个可观察的属性并将其绑定。我试图向您展示如何将搜索文本绑定到此演示，但它搜索错误的值（旧值）。

这里是ViewModel：Shell.js（开箱即用）

define(['plugins/router', 'durandal/app'], function (router, app) {
    return {
        router: router,
        search: function() {
            app.showMessage('Search not yet implemented...');
        },
        activate: function () {
            router.map([
                { route: '', title:'Welcome', moduleId: 'viewmodels/welcome', nav: true },
                { route: 'flickr', moduleId: 'viewmodels/flickr', nav: true }
            ]).buildNavigationModel();

            return router.activate();
        }
    };
});

我添加了observable属性：searchText，并修改了搜索功能以显示其“值”：

searchText: ko.observable(),
search: function() {
    app.showMessage('Search not yet implemented... Searching for: ' + this.searchText() );
},

我将它绑定到视图：shell.html

<input type="text" class="search-query" placeholder="Search" data-bind="value: searchText">

有些东西不对，搜索中显示的值是旧值，而不是当前值。显然首先执行搜索功能，然后设置/更新searchText的值。但我不确定。

我们如何解决这个问题？（在搜索过程中使用最新值）

Answer 1

搜索方法与data-bind="submit:search"连接，但默认情况下，KO在使用change绑定时会侦听输入上的value事件。

但是，当您按Enter键并提交搜索表单时，您的输入change事件不会立即触发，因此您会看到“旧”值。

您可以使用valueUpdate: 'afterkeydown'解决此问题（请参阅doc），以便KO在您输入内容后立即更新searchText：

<input type="text" class="search-query" placeholder="Search" 
       data-bind="value: searchText, valueUpdate: 'afterkeydown'">

如何使用Durandal / Knockout Startkit搜索文本绑定？

1 个答案: