Javascript 淘汰式布局和转置行绑定

我是new knockout.js，我使用x-editable和knockout-x-editable绑定数据输入表单，如下所示

<table>
  <tbody>
    <tr data-bind="foreach: employee">
      <td class="span1">
        <span data-bind="visible: $index() == 0">Firstname</span>
      </td>
      <td class="span1 protected">
        <span data-bind="editable: Firstname, editableOptions: { name:'Firstname', pk: ID"></span>
      </td>
    </tr>
    <tr data-bind="foreach: employee">
      <td class="span1">
        <span data-bind="visible: $index() == 0">Lastname</span>
      </td>
      <td class="span1 protected">
        <span data-bind="editable: Lastname, editableOptions: { name:'Lastname', pk: ID"></span>
      </td>
    </tr>
  </tbody>
</table>

名字
姓氏

行应按如下所示进行换位

Firstname | Firstname1 | Firstname2 | Firstname3 Lastname | Lastname1 | Lastname2 | Lastname3 名字|名字1 |名字2 |名字3 姓氏|姓氏1 |姓氏2 |姓氏3

---

我想使用淘汰模板，有没有更好的方法来实现这一点？非常感谢您在这方面提供的任何帮助。

无论如何，您都需要在同一列表中循环两次。在这里使用模板不会给您带来真正的好处

这是因为您必须通知模板它需要呈现员工的哪一部分，并且没有本机方法。模板用于呈现单一类型的对象。使用同一模板在同一类型的对象上呈现不同的属性违背了它们的用例。（另一种选择，即使用两个不同的模板，与简化的意图背道而驰。）

你可以探索，但我倾向于说“这是过度工程”，我怀疑在这种情况下值得付出努力

我会使用一个虚拟元素（一个看起来像

的HTML注释）而不是

可见的
绑定，但除此之外，我的方法看起来与您的大致相同：


名字
姓氏


如果要将更多属性呈现到表中，可以更改数据模型：

function ViewModel() {
  var self = this;

  self.employee = ko.observableArray([/* many employees here */]);
  self.properties = ['Firstname', 'Lastname', 'Email', 'Phone', 'Jobtitle'];
}

及



请注意，绑定上下文可以嵌套：
foreach:properties
创建一个新上下文，内部上下文（
foreach:$root.employee
）可以通过
$parent
变量引用外部上下文。通过这种方式，您可以对员工的不同属性重复使用内部设置（并且可以在代码中定义输出的顺序）

$parent
指的是父数据，在这种特定情况下，即
属性
数组中的字符串。
您忘了提到问题所在。Tomalak，有没有更好的方法来实现这一点，请看我在列表中循环多次以列出元素，我正在寻找一种更好的方法来实现这一点，如果没有冗余循环，可能使用ko模板会更好，