Knockout.js中的"模型"和"ViewModel"

Question

在MVC中," 模型 "只是数据的代码表示(例如,在ASP.NET MVC中,它是具有相应字段的类).

然而在Knockout(使用MVVM)中,我看到带有字段的对象称为"ViewModel".从官方KO文件:

模型:应用程序的存储数据.此数据表示业务域中的对象和操作(例如,可以执行汇款的银行帐户),并且独立于任何UI.使用KO时,通常会对某些服务器端代码进行Ajax调用,以读取和写入此存储的模型数据.

视图模型:UI上数据和操作的纯代码表示.例如,如果您正在实现列表编辑器,则视图模型将是一个包含项列表的对象,并公开添加和删除项的方法.

从示例中可以看出,ViewModel是具有字段的对象,包含数据,通常由Model在MVC中完成的操作:

var myViewModel = {
    personName: ko.observable('Bob'),
    personAge: ko.observable(123)
};

所以我在这里有点失落.什么'模型'和'ViewModel'在Knockout.js域中意味着什么？

Answer 1

在JavaScript实现的MVVM模式中,"模型"部分通常由web api提供.提供给页面的数据是模型.现在,一旦它在JavaScript中,该数据是否包含在单独的模型对象中 - 这是另一个故事.

通常,视图模型只是一个模型,它已经使用属性和函数进行了扩充,以支持应用它的特定视图.客户端计算,下拉查找值,客户端验证例程等.在这种情况下,视图模型可能如下所示:

var vm = {
    save: function(){ save logic... },
    cancel: function(){ cancel logic... },
    states: ko.observable(), //list of states for state dropdown
    customerId: ko.observable(),
    customerFirstName: ko.observable(),
    customerLastName: ko.observable()
};

其他时候,模型将保持在单独的对象中.在这种情况下,视图模型可能如下所示:

var customerModel = getCustomerFromDataSource();
var vm = {
    save: function(){ save logic... },
    cancel: function(){ cancel logic... },
    states: ko.observable(), //list of states for state dropdown
    customer: customerModel
};

要记住的主要事情是模型是数据,视图模型是使模型可用于视图的层(通常通过数据绑定).有时模型可能是一个单独的类; 其他时候,模型只是视图模型中的一组已知属性.