MVVM架构~knockoutjs系列之Mapping插件为对象添加ko属性

返回目录

对于一个ＪＳ对象来说，如果希望将所有属性进行监视，在之前我们需要一个个对属性添加ko.observable方法，而有了Mapping插件后，它可以帮助我们这件事．

在Mapping出现之前

var data={        serverTime:ko.observable( '2010-01-07'),        numUsers: ko.observable(3),        realUsers: ko.observable(3),}

我们需要对data对象里所有属性添加ko.observable方法，才可以对它进行监视．

Mapping出现之后

假设有这样一个场景，我们在对象里的realUsers需要跟随numUsers进行变化，这时，我们使用Mapping进行对象的KO处理，然后再使用ko.computed方法进行绑定，看一下代码

 　 var data = {        serverTime: '2010-01-07',        numUsers: 3,        realUsers: 3,    }    var M = ko.mapping.fromJS(data);//data对象里所有属性添加ko属性    M.realUsers = ko.computed(function () {        return M.numUsers() ? M.numUsers() * 2 : 0;    });    ko.applyBindings(M, document.getElementById("model2"));

对应的ＨＴＭＬ代码如下

<div id="model2">    <input type="text" data-bind="value:serverTime" />    <input type="text" data-bind="value:numUsers,valueUpdate: 'afterkeydown'" />    <input type="text" data-bind="value:realUsers" /></div>

通过这个例子，让我们知道如何快速的为ＪＳ对象添加KO属性，呵呵．

返回目录