javascript - 为行 knockout 创建标题

Question

我在创建命名行的方法时遇到问题。行号存储在数据库中，我基本上希望它就像如果行号为 1，则标题为“联系信息”。目前我有这个，它可以工作，但会导致困惑的标记，因为将有 12 行带有标题。

<!-- ko if: {{ row }} === 1 -->
    <h4>Contact Information</h4>
<!-- /ko -->
<!-- ko if: {{ row }} === 3 -->
    <h4>Opening Times</h4>
<!-- /ko -->
<!-- ko if: {{ row }} === 5 -->
    <h4>Company Details</h4>
<!-- /ko -->

我正在尝试在数据绑定(bind)中执行此操作，我已经从这里开始

<h4 data-bind: visible: hasHeaderForRow($data, {{ row }}, text: headerTextForRow($data, {{ row }}))></h4>

但无法弄清楚如何创建模型来使其工作。

Answer 1

我建议您使用旧的 $index() 来解决您的问题。 您应该将数组 rowTitles 添加到您的 View 模型以及 getTitleForRow 方法。

例如

rowTitles: ['Contact Information', 'Opening Times', 'Company Details' ],

getTitleForRow: function (index) {
  return this.rowTitles[index];
}

在这种情况下，您的标记应如下所示:

<div data-bind="foreach: rows">
  <h4 data-bind="text: $parent.getTitleForRow($index())"></h4>
</div>

如果从后端获取 rowTitles 数组，您应该将其设为可观察数组并用来自服务器的数据填充它。