为什么我的 knockoutjs observableArray 数据更新不触发任何东西？答案

【问题标题】：Why doesn't my knockoutjs observableArray data update trigger anything?为什么我的 knockoutjs observableArray 数据更新不触发任何东西？
【发布时间】：2011-09-27 13:55:15
【问题描述】：

这个页面的想法是，我有一个文本字段，当您输入三个或更多字符时，它会触发一个 ajax 查询来搜索用户列表。这部分工作正常，console.log() 调用表明我正在获取良好的数据并将其分配给我的视图模型的 .users 字段。

问题是，这不会触发任何可观察到的行为。在 HTML 中，我有一个与foreach: users 绑定的模板，我在userCount 上绑定了一个跨度，这两个都没有更新。但是，如果我在控制台上输入viewModel.users().length，我会得到正确的值。但我不知何故破坏了可观察性。

var viewModel = {
    users: ko.observableArray([]),
    term: ko.observable('')
};


ko.dependentObservable( function() {
    if (this.term().length > 2) {
        $.get('http://mydatasource.com/path/?term=' + this.term(),
        function(data) {
            viewModel.users(data);
            console.log(viewModel.users());
        })
    }

}, viewModel);

viewModel.userCount = ko.dependentObservable( function() {
    return this.users().length;
}, viewModel );


ko.applyBindings(viewModel);

编辑：刚刚将我的 ajax 获取依赖可观察函数修改为：

ko.dependentObservable( function() {
    if (this.term().length > 2) {
        $.get('http://mydatasource.com/path/?term=' + this.term(),
        function(data) {
            viewModel.users([]);
            $.each(data, function(i, item) {

                console.log(item.label);
                viewModel.users.push({value: ko.observable(item.value), label: ko.observable(item.label)});

            } );
        })
    }

}, viewModel);

完全没有区别。但是我可以在控制台中看到正确返回的标签值，并且 viewModel.users().length 再次给了我满意的答案。

编辑：我用小提琴中提供的@RP Niemeyer 替换了我的观点，并且它起作用了......所以这与我的观点有关。这是我所拥有的：

<input data-bind="value: term, valueUpdate: 'afterkeydown'"><br/>
<h2><span data-bind="value: userCount"></span> Users Listed</h2>
<table data-bind="foreach: users">
    <tr><td data-bind="text: label"></td><td data-bind="text:value"></td></tr>
</table>

<div data-bind="text: ko.toJSON(viewModel)"></div>

【问题讨论】：

从您发布的代码中看起来不错。也许发布您的一些观点或尝试根据这个小提琴进行复制：jsfiddle.net/rniemeyer/FDZJx
@RPNiemeyer ：将您的答案发布为答案，以便我接受，好吗？感谢您对此提供的帮助。

标签： knockout.js

【解决方案1】：

从您发布的代码中看起来不错。也许发布您的一些观点或尝试根据这个小提琴进行复制：http://jsfiddle.net/rniemeyer/FDZJx

更新：使用您的观点：http://jsfiddle.net/rniemeyer/FDZJx/2/。看起来还是不错的。您的第一个输入元素没有关闭，但它没有给我带来问题。可能会导致您正在使用的浏览器出现问题。

【讨论】：