2013-07-02 95 views
1

我無法理解爲什麼此綁定安裝程序無法正常工作。bindingable元素observableArray內observableArray

我有一個頁面對象的ID和名稱,我有一個batchDocumentId observable和一個頁面observableArray pendingBatchDocument。在我的viewmodel中,我試圖用PendingBatchDocument初始化一個可觀察數組,並用它們的Pages數組初始化這些PendingBatchDocuments。

語法不給我任何錯誤,所以我假設設置沒有問題。讓我知道,如果它不正確。

我的問題是,爲什麼不綁定第二個foreach工作?

查看

<div data-bind="foreach: pendingDocs"> 
    <ul class="sortable" data-bind="foreach: pendingDocs().pages()"> 
    </ul> 
</div> 

的Javascript視圖模型

function Page(id, name) 
{ 
    this.id = ko.observable(id); 
    this.name = ko.observable(name); 
} 

var PendingBatchDocument = function(batchDocumentId, pages) 
{ 
    this.batchDocumentId = ko.observable(batchDocumentId); 
    this.pages = ko.observableArray(pages); 
}; 

var ViewModel = function() 
{ 
    this.list1 = ko.observableArray([ 
    { itemId: "C1", name: "Item C-1" }, 
    { itemId: "C2", name: "Item C-2"}, 
    { itemId: "C3", name: "Item C-3"}, 
    { itemId: "C4", name: "Item C-4"}, 
    { itemId: "C5", name: "Item C-5"}, 
    { itemId: "C6", name: "Item C-6"}, 
    { itemId: "C7", name: "Item C-7"}]); 

    this.pendingDocs = ko.observableArray([ 
    new PendingBatchDocument(1, [ 
     new Page(1, "Page 1"), new Page(2, "Page 2"), new Page(3, "Page 3") 
    ]) 
    ]); 
}; 

ko.applyBindings(new ViewModel()); 

JSBin http://jsbin.com/ivavew/3/edit

回答

2

foreach結合內部的環境是獨立的數組元素,這意味着裏面foreach: pendingDocs,你已經擁有了訪問PendingBatchDocument實例,因此您可以使用它的pages ty直接:

<div data-bind="foreach: pendingDocs"> 
    <ul class="sortable" data-bind="foreach: pages"> 
    </ul> 
</div>