在單個視圖中使用多個模板和綁定

我正在使用KnockoutJS來顯示圖像列表。假設我正在使用模板X來顯示此列表，並且我已經定義了另一個模板Y以在選定圖像的單獨對話框中顯示細節。我現在面臨的問題所選擇的圖像這一細節模板Y.下面結合我的實際視圖的模擬/部分代碼在單個視圖中使用多個模板和綁定

視圖模型：

var viewModel { 
    photos:ko.observableArray(//list of photos), 
    showDetails:function(item){ 
     //show the details of the selected image in dialog 
    } 
};

應用爲

ko.applyBindings(viewModel);

結合這是如何定義X的

<script id="X" type="text/html"> 
    {{each(i,item) photos()}} 
     <a href="javascript:;" data-bind="click:function(){showDetails(item);}">show Image</a> 
    {{/each}} 
</script>

這是如何應用模板

<div class="list" data-bind="template: {name:'X'}"></div>

這是模板y的樣機

<script id="Y" type="text/html"> 
    <img src="{url}" /> 
</script>

我應該如何界定showDetails功能應用綁定到模板Y'

來源

2011-02-06 frictionlesspulley

這是一個示例：http://jsfiddle.net/rniemeyer/MCQgY/。

最簡單的方法是定義一個代表所選照片的觀察值。然後，點擊綁定就需要通過調用它來設置observable：viewModel.selectedPhoto（$ data）。

希望這會有所幫助。如果您有其他疑問/問題，請告訴我。

來源

2011-02-07 03:20:52

謝謝。我正在嘗試相同的事情，而不是將值設置爲viewModel.selectedPhoto（$ data）我試圖viewModel.selectedPhoto = $ data – frictionlesspulley 2011-02-07 05:41:28

在單個視圖中使用多個模板和綁定

回答

相關問題