Использование нескольких шаблонов и привязок в одном представлении

Question

Я использую KnockoutJS для отображения списка изображений. Скажем, я использую шаблон X, чтобы показать этот список, и я определил еще один шаблон Y, чтобы отображать детали в отдельном диалоговом окне выбранного изображения. Я сталкиваются с проблемами связывания выбранного изображения с этой детали шаблона Y. Ниже приведен макет/частичный код моего фактического зрения

ViewModel:

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?

Answer 1

Вот пример, который работает: http://jsfiddle.net/rniemeyer/MCQgY/.

Самый простой способ - определить наблюдаемое, которое представляет выбранную фотографию. Связывание с кликом затем просто нужно установить наблюдаемое, вызвав его так: viewModel.selectedPhoto ($ data).

Надеюсь, это поможет. Сообщите мне, есть ли у вас дополнительные вопросы/проблемы.