动态视图模型的淘汰赛

关于如何通过Knockout处理动态视图（通过ajax调用）的interwebs上有很多信息，但是有动态视图模型的最佳做法吗？例如，假设我有一个页面应用程序，它根据角色，用户选择，上下文等等（通过ajax）呈现不同类型的表单（具有不同的输入字段），不仅我将使用每个表单的模板，但我想为viewmodel做同样的事情，因为每个viewmodel可能有很多不同的属性，并且对于每个可能的模板都有一个巨大的viewmodel是不现实的。动态视图模型的淘汰赛

我是一个有ko的新手，它可能并不是要用于这种方式。任何意见非常感谢。

来源

2011-11-03 jimlyndon

做这种事情的一种流行方式是拥有一个主视图模型来托管子视图模型。

下面是定义具有模板和关联数据的“模型”对象的一个非常基本的示例。

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/

很显然，你不可能绑定在选择模型的选择，但它有助于展示如何能行得通。而不是数组，模型可能是属性名称与密钥匹配的对象。

“模型”对象中的“数据”将是您的子视图模型。

来源

2011-11-03 21:38:16

谢谢瑞恩，我想我已经开始更清楚地看到KO了。使用这种方法加上KO Mapping插件将数据（第一，最后，名称，描述等）绑定为可观察数据是否正确？在我的scenerio中，我通过ajax提取数据。事实上，如果我最终通过ajax同时提取模板和数据，我应该可以在Success回调中调用'applyBindings'来将所有东西都钩住 - 正确吗？当我有一些时间空闲时，我会在周末放弃这一点。 – jimlyndon

用这个想法使用映射插件绝对没问题。在成功回调中调用applyBindings是很好的。除非传递第二个参数以将其限制为某个元素，并且仅针对非子元素的多个元素进行多次调用，否则您只需要一次调用它。否则，在我提供的示例中，您可以先调用applyBindings，直到selectedModel被填充，否则实际上没有任何绑定。 –

我面临同样的问题。

尝试Knockout Namespaces

来源

2012-10-05 08:17:07

动态视图模型的淘汰赛

回答

相关问题