Плагин Knockout Mapping - сопоставление объектов с наблюдаемыми

Question

Я хотел бы использовать подключаемый модуль отображения нокаута, но мне нужно, чтобы объекты в моей модели были свойствами сами по себе (в основном потому, что они должны быть способны к замене).

Рассмотрим значительно упрощенный пример со следующей моделью:

{
  family: {
    patriarch: {
      name: "Fred Flintstone", child: "Pebbles"
    }
  },
  allPeople: [
    {name: "Fred Flintstone", child: "Pebbles"},
    {name: "Wilma Flintstone", child: "Pebbles"},
    {name: "Barney Rubble", child: "Bam Bam"}
  ]
}

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

Плагин mapping делает все свойства имен наблюдаемыми, а allPeople - observableArray, но для того, чтобы мой выбор работал должным образом, сам объект патриарха должен быть наблюдаемым.

Написание моего собственного грубого маппера - это всего 13 строк кода, но поскольку плагин картирования настолько полнофункциональный, я надеюсь, что есть вариант или какой-то другой способ заставить этот, казалось бы, распространенный сценарий работать.

Answer 1

Как насчет этого? Для избранных:

<select data-bind="options: allPeople, optionsText: 'name', value: family.patriarch"></select>

И при настройке сопоставления вместо указания модели подчиненного представления для свойства patriarch возвращайте наблюдаемое с использованием исходных данных:

var data = {
  family: {
    patriarch: {
      name: "Fred Flintstone", child: "Pebbles"
    }
  },
  allPeople: [
    {name: "Fred Flintstone", child: "Pebbles"},
    {name: "Wilma Flintstone", child: "Pebbles"},
    {name: "Barney Rubble", child: "Bam Bam"}
  ]
};


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

var vm = ko.mapping.fromJS(data, mapping);

vm.family.patriarch.subscribe(function(value) {
    alert(ko.toJSON(value));
});

ko.applyBindings(vm);

Скрипка здесь:

http://jsfiddle.net/SZXDG/6/

Это работает, как вам нужно?