1

我在 knockout.js 中的条件渲染遇到了一些问题。我的视图模型中有一个observableArray,它是使用ko.utils.arrayMap(). 在我的 javascript 代码中,输出该数组的长度会返回预期的长度。但是,当我尝试在我的视图中输出相同的长度时,它始终为 0。

这是我的视图代码:

<!-- ko if: people().length == 0 -->
    <p data-bind="text: people().length"></p>
    <!-- always outputs 0 -->
<!-- /ko -->
<!-- ko if: people().length > 0 -->
    <p data-bind="text: people().length"></p>
    <!-- never reaches this -->
<!-- /ko -->

Javascript:

var data = [
    {
        firstName: "Bob",
        lastName: "Smith"
    },
    {
        firstName: "John",
        lastName: "Doe"
    },
    {
        firstName: "Jane",
        lastName: "Doe"
    }
];

function Person(firstName, lastName) {
    this.firstName = firstName;
    this.lastName = lastName;
}

function ViewModel(data) {
    var self = this;
    self.people = ko.observableArray(ko.utils.arrayMap(data, function(i) {
        return ko.observable(new Person(i.firstName, i.lastName));
    }));
    console.log(self.people().length);  //Outputs 3, as expected
}

ko.applyBindings(new ViewModel(data));
4

1 回答 1

3

如果您替换视图模型中的可观察对象而不是分配给它,则可能会发生这种情况。您可能self.people = ko.observableArray();在您的视图模型构造函数中有。稍后,当您实际获取数据时,您拥有self.people = ko.observableArray(thedata);.

在这种情况下,您的视图模型知道数据,但视图绑定到较早的 observable 并且不知道后面的。相反,您应该self.people(thedata);设置数据。

于 2013-06-03T20:12:40.287 回答