我怎么知道knockout.js ViewModel中的变化只是通过改变它的可观察属性?

时间:2017-02-20 17:27:39

标签: javascript jquery mvvm knockout.js viewmodel

我在knockout.js中有一个ViewModel用于个人信息。 我希望javascript认为如果只更改该模型中的单个可观察属性,整个PersonViewModel都会被更改。

我还有另一个ViewModel用于地址,我希望它也一样。 作为程序的最终用户,我希望程序通过更改任何可观察属性来判断哪个视图模型已更改。

我可以使用"订阅"但这意味着我必须订阅视图模型中的每个可观察对象,我不想这样做。 形象地说,我想订阅整个ViewModel而不是其中的每个observable。 我该怎么办?

function PersonViewModel() {
        this.firstName = ko.observable("John");
        this.lastName = ko.observable("Doe");
        this.middleName = ko.observable();
        this.userName = ko.observable("Johnny");
        this.dateOfBirth = ko.observable("12/12/2012");

    this.firstName.subscribe(function () {
        alert("fisrtName changed");
    });
}

 function AddressViewModel() {
        this.city = ko.observable("@Model.City");
        this.street = ko.observable("@Model.Street");
    }

var pvm = new PersonViewModel();
var avm = new AddressViewModel();
var pNode = $("#personal-information").get(0);
var aNode = $("#address-information").get(0);
ko.applyBindings(pvm, pNode);
ko.applyBindings(avm, aNode);

我的HTML:

  <div id="personal-information">
        <input data-bind="value: firstName" type="text" >
        <input data-bind="value: lastName" type="text" >
        <input data-bind="value: middleName" type="text" >
        <input data-bind="value: username" type="text" >
        <input data-bind="value: dateOfBirth" type="text" >
     </div>

任何帮助将不胜感激。 感谢。

1 个答案:

答案 0 :(得分:2)

Knockout包含一个ko.toJS函数,它“克隆你的视图模型的对象图,用每个observable代替该observable的当前值,这样你就得到一个只包含你的数据而没有Knockout相关工件的普通副本。 “如果在计算中调用ko.toJS,则只要视图模型中的任何observable发生更改,计算结果都会更新。

var p = ko.computed(function () {
    return ko.toJS(pvm);
});
var log = ko.observableArray();
p.subscribe(function (value) {
    log.push("Person changed");
});

https://jsfiddle.net/mbest/ubLzwerp/

另见https://stackoverflow.com/a/7850364/1287183