Knockout Mapping-настройка создания с вложенными объектами

я столкнулся с проблемой с плагином отображения KnockoutJS, где мне нужно сделать следующее:

  1. настройка создания отображения объекта
  2. настройка создания отображения массива вложенных объектов из #1.

в этой пример скрипку я пытаюсь иметь дети правильно сопоставлены с их создания. Ожидаемым результатом является то, что каждый из дети есть добавлено описание собственность. Из скрипки результат должен гласить:

  • Адам Смит
  • Бобу 5 лет
  • Крису 7 лет

Я могу продемонстрировать ожидаемое поведение в этом this пример скрипку. Обратите внимание, что в этом коде я должен иметь два набора данных, первый из которых имеет пустой массив дочерних объектов. Следующая строка кода вызовет настраиваемое создание дочернего элемента объекты:

ko.mapping.fromJS(additionalData, parentMapping, viewModel);

к сожалению, это требует наличия пустого начального дети и картографическая два раза. Это неприемлемо, поскольку код на самом деле имеет гораздо более глубокую иерархию.

в дополнение к вышесказанному я попытался добавить следующий код в parentMapping:

var mapping = { 'ignore': ["children"] };
var innerModel = ko.mapping.fromJS(options.data, mapping);
//for brevity
innerModel.children = ko.mapping.fromJS(options.data.children, childMapping);

это имеет эффект отображения дети объекты на начальном отображении. Однако все последующие сопоставления дети свойство игнорируется.

есть ли способ настроить создание как родительского, так и дочернего объекта с отображением нокаута?

спасибо.

1 ответов


http://jsfiddle.net/5cfa3/23/

var viewModel = {};

var data = {
  id: "1",
  firstName: 'Adam',
  lastName: "Smith",
  children: [ {id: "2", name: "Bob", age: 5}, {id: "3", name: "Chris", age: 7 }]
};

var Parent = function(data){
  ko.mapping.fromJS(data, mapping, this)
};

var mapping = {
  create:function(options){
    var parent = new Parent(options.data);
    parent.fullName = ko.computed(function(){
        return parent.firstName() + " " + parent.lastName();
    });
    return parent;
  },
  'children': {
     create: function(options) {
         options.data.description = ko.computed(function(){
             return options.data.name + " is " + options.data.age + " years old ";
         });
         return ko.mapping.fromJS(options.data);         
     }
   }
};

viewModel = ko.mapping.fromJS(data, mapping);

ko.applyBindings(viewModel);