Question

从客户端，我必须对REST服务进行多次ajax调用，这将给我三个不同的JSON域模型。现在在客户端，我必须将它们转换为viewmodel，然后再将它们绑定到控件。这意味着将它们转换为完全不同的结构，只显示数据。任何想法或建议都会有所帮助。

Answer 1

var viewModel = JSON.parse（jsonContentFromService）;

也许这样的话：

var mainVM = {};

mainVM.SomeStuffFromVm1 = vm1.WhateverYouNeed
mainVM.SomeStuffFromVM2  = vm2.WhateveryYouNeed;

Answer 2

您应该查看John Papa关于单页Web应用程序的课程。他描述了一种我认为适合您需求的架构。虽然他只有一个Web API，但如果使用多个，那么架构没有区别。

简而言之，您需要一个模型模块来定义客户端对象的形状（model.employee和model.customer）。然后，您的视图模型模块包含视图模型，其中包含（其中包括）一个或多个这些对象。例如。 vm.employees将包含员工对象的列表（ko.observableArray），vm.employeesAndCustomers将包含ko.observableArray个员工及其关联客户。如果您希望视图模型仅包含model.employee对象的部分数据和model.customer对象的部分数据，则需要定义新模型，例如model.employeeBrief和{{1然后定义一个使用此类项列表的视图模型。

您应该使用model.customerBrief模块从服务中检索数据，并使用dataservice模块将收到的JSON转换为客户端（model。*）对象列表，并保留内存列表这些。视图模型从datacontext收到observableArrays。

datacontext将使用datacontext模块将收到的JSON转换为客户端表单。

Answer 3

http://jsfiddle.net/sujesharukil/RJGQw/

var vm1 = {
    Id: 1,
    Name: 'some name',
    Address1: 'Some street somewhere',
    City: 'New York',
    Country: 'USA',
    Zip : '11111'
};

var vm2 = {
    title: 'Mr',
    designations: ['Chief', 'Boss', 'Lord'],
    secrets: ['xxxxx','yyyyy','zzzzz']
};


var vmCombines = function(data1, data2){
    return {
        combinedName: ko.observable(data2.title +  ' ' + data1.Name),
        designation: ko.observable(function(){
            if(data2.designations.length == 0)
                return '';

            return data2.designations.join();
        }()),
        Address: ko.observable(function(){
            return data1.Address1 + ', ' + data1.City + ',' + data1.Country + ',' +     data1.Zip
        }())
    }
};

ko.applyBindings(new vmCombines(vm1, vm2));

和HTML

<input type="text" data-bind="value: combinedName"/><br />
<input type="text" data-bind="value: designation"/><br />
<input type="text" data-bind="value: Address"/><br />

淘汰赛 - Viewmodel转型

3 个答案: