Популярный способ сделать это - создать модель основного вида, в которой размещены модели подвидов.
Вот действительно базовый пример определения «модельных» объектов, которые имеют шаблон и связанные данные.
function Model(key, template, data) {
this.key = key;
this.template = ko.observable(template);
this.data = data;
}
var viewModel = {
models: ko.observableArray([
new Model("user", "userTmpl", { first: "Bob", last: "Smith" }),
new Model("item", "itemTmpl", { name: "MyItem", description: "Here are some details" })
]),
selectedModel: ko.observable()
};
ko.applyBindings(viewModel);
Тогда вы можете использовать его как:
<select data-bind="options: models, optionsText: 'key', optionsCaption: 'select a model...', value: selectedModel"></select>
<hr />
<div data-bind="with: selectedModel">
<div data-bind="template: { name: template(), data: data }"></div>
</div>
<script id="userTmpl" type="text/html">
<span data-bind="text: last"></span>, <span data-bind="text: first"></span>
</script>
<script id="itemTmpl" type="text/html">
<h3 data-bind="text: name"></h3>
<div data-bind="text: description"></div>
</script>
http://jsfiddle.net/rniemeyer/29kWf/
Очевидно, вы вряд ли будете связывать выбор модели в выборке, но это помогает показать, как она может работать. Вместо массива ваши модели могут быть объектами с именами свойств, соответствующими ключу.
"Данные" в объектах "модель" будут вашими моделями подвидов.