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

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

0 голосов
/ 25 февраля 2012

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

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)я могу видеть из источника) ожидая, что viewModel будет корневой моделью .Я знаю, что могу вручную просмотреть все наблюдаемые и обновить их значения, или отключить отображение rootModel, установить свойство и затем обновить root, но я верю, что есть более сложный и элегантный способ сделать это.

Спасибо.

1 Ответ

1 голос
/ 26 февраля 2012

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

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

Вот рабочий JSFiddle для демонстрации:

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

...