knockout.js - Knockout observable array randomly doesn't bind

Question

I'm having a problem with durandal/knockout/sammy - not sure which one is the culprit. Occasionally my var roots = ko.observableArray([]); doesn't get bound to the UI. Most of the time it works perfectly. Hopefully someone on SO sees something I don't.

VM Activate:

var activate = function () {
        groupsData.GetRoots().then(function (data) {
            roots($.map(data, function (it) { return new groupNode.GroupNode(it); }));
//If I do a console.log(roots()); right here, the correct data shows up
        });
    };

DataContext:

var getRoots = function () {
    return Q.when($.getJSON(Url));
};

My view: If I hit refresh over and over, the span with the 'length' in it will show the correct length MOST OF THE TIME. Occasionally it will be 0 and the UI inside of the foreach will not show.

    <span data-bind="text: roots().length"></span>
    <ul data-bind="foreach: roots">
        //BLA
    </ul>

Answer 1

你需要return在activate函数中进行promise，否则它不会知道promise什么时候完成。

var activate = function () {
    return groupsData.GetRoots().then(function (data) {
        roots($.map(data, function (it) { return new groupNode.GroupNode(it); }));
    });
};

如果您这样做，数据绑定将在承诺完成之前发生，这将消除您看到的竞争条件。