2013-05-03 2 views
0

Есть ли способ сделать это более «автоматически»?KnockoutJS map array объекта сложного типа

код JavaScript

var _json = { 
    Parents : [ 
     { ID: 1, Option: { ID: 0, Name: "Zero" } }, 
     { ID: 2, Option: { ID: 0, Name: "Zero" } } 
    ],   
    Options : [ 
    { ID: 0, Name: "Zero" }, 
    { ID: 1, Name: "One" }, 
    ] 
}; 

var mapping = { 
     'Parents': { 
      create: function(options){ 
       options.data.Option = ko.observable(options.data.Option); 
       return options.data; 
      } 
     } 
    }; 

var viewModel = ko.mapping.fromJS(_json, mapping); 
ko.applyBindings(viewModel); 

HTML разметка

<div data-bind="foreach: Parents"> 
    <p> 
    <b data-bind="text: $data.ID"></b> 
    <select name="x" data-bind="options: $parent.Options, optionsText: 'Name', value: $data.Option"></select> 
    <span data-bind="text: ko.toJSON($data)"></span> 
    </p> 
</div> 

Вот пример jsfiddle http://jsfiddle.net/BvVce/11/

ответ

1

У меня есть написал простую рекурсивную функцию отображения. Это то, что вы ищете:

var _json = { 
    Parents : [ 
     { ID: 1, Option: { ID: 0, Name: "Zero" } }, 
     { ID: 2, Option: { ID: 0, Name: "Zero" } } 
    ],   
    Options : [ 
    { ID: 0, Name: "Zero" }, 
    { ID: 1, Name: "One" }, 
    ] 
}; 

function convertToObservable(obj) { 
    var newObj = {}, 
     key, 
     value; 

    if (!$.isPlainObject(obj)) { 
     return obj; 
    } 

    for (key in obj) { 
     if (obj.hasOwnProperty(key)) { 
      value = obj[key]; 
      // console.log(key + ':', value); 
      newObj[key] = $.isArray(value) 
       ? ko.observableArray($.map(value, convertToObservable)) 
       : $.isPlainObject(value) 
         ? ko.observable(convertToObservable(value)) 
         : ko.observable(value); 
     } 
    } 
    return newObj; 
} 

var viewModel = convertToObservable(_json); 
ko.applyBindings(viewModel); 

Проверьте это на скрипача: http://jsfiddle.net/tkirda/BvVce/12/

Смежные вопросы