Отображение Knockout.js. Как обновить только часть модели представления?

Question

Я хочу построить простую страницу, где пользователь может выбрать одну фотографию из списка и изменить некоторые свойства, поэтому я построил модель:

model = { 
      newPhotos: [], 
      currentPhoto: { 
       id: 0, 
       description: "" 
      }, 
      setCurrent: function (photo, e) { 
       ko.mapping.fromJS(ko.mapping.toJS(photo), viewModel.currentPhoto); 
      } 
     } 

и разметки:

   <div class="content" data-bind="foreach: newPhotos"> 
        <div class="photo" data-bind="click: $parent.setCurrent"> 
         <div class="frame" data-bind="img: imageSrc"> 
         </div> 
        </div> 
       </div> 
     <div class="edit-area" data-bind="with: currentPhoto"> 
      <canvas id="image-edit" /> 
      <textarea class="multi-line" name="PhotoDesc" data-bind="value: description"></textarea> 
     </div> 

Основная идея заключается в том, что, когда пользователь нажимает на фотографию, setCurrent функция называется и там я могу обновить currentPhoto с видом модели, которые переходят на пересылку в setCurrent, , но есть проблемаko.mapping.fromJS(jsObj, viewModel) (как я могу видеть из источника) e что viewModel будет корневой моделью. Я знаю, что могу вручную просматривать все наблюдаемые данные и обновлять их значения, а также отключать rootModel, устанавливать свойство, а затем обновлять root, но я верю, что есть более сложный и элегантный способ сделать это.

спасибо.

Answer 1

Настройте свою текущую фотографию как наблюдаемую, а затем вы можете использовать карту для загрузки наблюдаемых деталей JSON.

self.currentPhoto(ko.mapping.fromJS(data)); 

Вот рабочий JSFiddle, чтобы продемонстрировать:

http://jsfiddle.net/jearles/wgZ59/7/