在淘汰赛中创建可重复使用的模板

Question

我已经创建了许多淘汰赛模板，它们基本上充当页面上的控件。例如，从一组值中进行选择的简单控件如下所示：

 <div data-bind="foreach: values">
      <div data-bind="css: { selectedItem: $parent.value() == $data.value }, event: { click: function () { $parent.value($data.value) } }">
           <span data-bind="text: name"></span>
      </div>
 </div>

我想在单个视图模型上的多个属性中重复使用此模板，但目前我看不出如何，因为绑定是“硬编码”的，即它总是在寻找values 属性和 name 属性等。

我知道 foreach 绑定有“as”别名选项，有什么类似的地方可以为模板的多个属性提供别名吗？还是有更好的方法来解决这个问题？

目前我有一个中间视图模型，它在构造函数中获取值、值和名称属性，然后将其用于绑定，但我觉得它不必要地复杂。

Answer 1

您可以结合模板和 foreach 技术来实现您需要的结果

http://knockoutjs.com/documentation/template-binding.html（见注3）

在不知道您的视图模型/html 的其余部分的情况下，以下应该可以了解它是如何工作的

<script type="text/html" id="name-set">
  <div data-bind="css: { selectedItem: $parent.value() == $data.value }, event: { click: function () { $parent.value($data.value) } }">
       <span data-bind="text: name"></span>
  </div>
</script>

<div data-bind="template: { name: 'name-set', foreach: values }"></div>