只呈现两个连续绑定元素中的第一个

Question

我不明白为什么这里的第二个项目没有渲染，即只有一个p得到输出。:

   <div class="row" data-bind="foreach: Foos">
       <div class="three columns">
           <p data-bind="text: CriteriaStub"></p>
           <p data-bind="text: CriteriaStub"></p>
       </div>
       <div class="three columns">
           <!--this gets rendered fine-->
           <p data-bind="text: Baa"></p>
       </div>
    </div>

这似乎只发生在连续的绑定元素上。

查看foreach的模型项:

var Foo= (function () {
    function Foo(jsonObject) {
        var self = this;
        self.AdHocRecipients = ko.observableArray(jsonObject.AdHocRecipients);
        self.CriteriaStub = ko.computed(function () {
            return "No criteria";
        });
        self.AdHocRecipientsToStringStub = ko.computed(function () {
            var stub = "";
            for(var i in self.AdHocRecipients()) {
                stub += (self.AdHocRecipients()[i].User) + ', ';
            }
            return self.AdHocRecipients().length > 0 ? stub.slice(0, -2) : "No recipiants";
        });
        var t = 2;
    }
    return Foo;
})();

父:

var ViewModel = (function () {
    function ViewModel(json) {
        var parsedFoos = new Array();
        for(var i in json.Foos) {
            parsedFoos.push(new Foo(json.Foos[i]));
        }
        this.Foos = ko.observableArray(parsedFoos);
    return ViewModel;
})();

Answer 1

我真的不确定，但唯一可能出现错误的是Foo是一个自动执行的函数，也返回自己。我不知道当你多次调用它的时候会得到什么。你试过把Foo作为一个函数吗?

function Foo(jsonObject) {
    var self = this;
    self.AdHocRecipients = ko.observableArray(jsonObject.AdHocRecipients);
    self.CriteriaStub = ko.computed(function () {
        return "No criteria";
    });
    self.AdHocRecipientsToStringStub = ko.computed(function () {
        var stub = "";
        for(var i in self.AdHocRecipients()) {
            stub += (self.AdHocRecipients()[i].User) + ', ';
        }
        return self.AdHocRecipients().length > 0 ? stub.slice(0, -2) : "No recipiants";
    });
    var t = 2;
}

另外，要小心你的html标签。虽然我认为自关闭标签通常是有效的，但它们并不总是有效，所以使用rather而不是。