Knockout.js 映射。如何仅更新视图模型的一部分？答案

【问题标题】：Knockout.js mapping. How to update only part of view model?Knockout.js 映射。如何仅更新视图模型的一部分？
【发布时间】：2012-03-15 17:45:00
【问题描述】：

我想建立一个简单的页面，用户可以从列表中选择一张照片并修改一些属性，所以我建立了模型：

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 函数被调用，我可以使用点击绑定传递到setCurrent 的视图模型更新currentPhoto，但是有问题 @ 987654326@（我可以从源代码中看到）期望 viewModel 将是根模型。我知道我可以手动检查所有 observables 并刷新它们的值，或者取消映射 rootModel，设置属性然后更新 root，但我相信有更复杂和优雅的方法来做到这一点。

谢谢。

【问题讨论】：

标签： javascript knockout.js knockout-mapping-plugin

【解决方案1】：

将您当前的照片设置为 observable，然后您可以使用 map 加载带有 JSON 详细信息的 observable。

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

这是一个可以工作的 JSFiddle 来演示：

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

【讨论】：