利用基因敲除綁定值

Question

我如何使用淘汰賽結合?:

創建以下的日曆電網將有7列渲染HTML日曆。 （每天一個）。表格的第一行（標題）將包含日期和日期。第二行將包含相應日期的值。下一行將是另一個標題，再後面是值。重複，直到月底。

我有我的一個觀察的集合對象中的所有數據：

function CalendarDate(id, date, volume) { 
    var self = this; 
    self.id = ko.observable(id); 
    self.date = ko.observable(date); 
    self.volume = ko.observable(volume); 
}; 

function ForecastViewModel() { 
    var self = this; 
    self.dates = ko.observableArray([]); 
} 

我覺得我應該用foreach約束力，但無法弄清楚如何第七列之後敷格。

任何想法？

Answer 1

鏈接到演示：JsFiddle

創建2個模板和容器

<div id="container" ></div> 

第一個是負責渲染日期框：

<script id="datebox" type="text/x-jquery-tmpl"> 
... 
</script> 

第二個是resposible 7天：

<script id="week" type="text/x-jquery-tmpl"> 
    <div data-bind="template: { name : 'datebox' , foreach : dates }"> 
</script> 

然後準備一個分割日期陣列的功能和應用模板是這樣的：

function splitDateArray() { 

    /** Splice observable Array 4 or 5 subArray depends on the month of year **/ 
    var subArray_one /* contains 7 date */ 
    var subArray_two /* contains 7 date */ 
    var subArray_three /* contains 7 date */ 
    var subArray_four /* contains 7 date */ 
    var subArray_five /* contains 0-3 date */ 

    /** Then create dynamic dom object and apply each array indivually to week template **/ 

    var week1=$("<div id='w1'></div>"); 
    $("#container").append(week1); 

    ko.applyBindingsToNode($("#w1").get(0) , { template: { name: 'week', data: subArray_one } }); 

    ... apply the same pattern for other arrays ... 

    ko.applyBindingsToNode($("#w2").get(0) , { template: { name: 'week', data: subArray_two } }); 

    ko.applyBindingsToNode($("#w3").get(0) , { template: { name: 'week', data: subArray_three } }); 

    ko.applyBindingsToNode($("#w4").get(0) , { template: { name: 'week', data: subArray_four } }); 

    ko.applyBindingsToNode($("#w5").get(0) , { template: { name: 'week', data: subArray_five } }); 

}

摘要：

使用ko.applyBindingsToNode功能準備好後陣來渲染子模板。這是我的第一個想法。可以有更高效的解決方案。

編輯：

這裏是思想的簡單implemantation不加詳細說明：JsFiddle