Question

请参阅我创建的以下示例。 https://jsfiddle.net/divekarvinit/5vh67sod/4/

在这个例子中，＆＃39; Allowances＆＃39; model包含各种属性。在这些属性中，对于特定的容差，要在屏幕上显示哪些属性包含在＆＃39;字段中。阵列。

在以下HTML代码中

<div data-bind="foreach : allowanceList">
  <div style="display : block; width : 100%">
    <span data-bind="text : allowanceTitle"></span>
  </div>
  <div style="margin-left : 20px" data-bind="foreach : fields">
    <div style="display : block; width : 100%">
      <label data-bind="text : title"></label>
      <!-- ko if : typeOfField() == "input"-->
      <input data-bind="value : '$parentContext.' + allowanceVariable() " />
      <!-- /ko -->
    </div>
  </div>
  <br/>
</div>

我想将<input>绑定到allowanceList的对象的属性，该对象的名称包含在'allowanceVariable'数组的'fields'变量的值中。

例如，对于allowanceList的第一次迭代和fields的第一次迭代，allowanceVariable()的值为＆＃39;小时＆＃39; 。因此，对于此迭代，我想将<input>绑定到allowanceList's当前对象的＆＃39;小时＆＃39; 字段。

正如小提琴中所见，目前，淘汰赛只将 $ parentContext.hours 复制到输入中。

如何达到预期效果？

Answer 1

在你的回答中，你正在硬编码allowanceVariable并使用if-else链单独检查它们。对于您添加的每个属性，您必须更新if-else块。它有效，但它们不再是动态 fields。

相反，you can use the keyword as and give an alias to your foreach binding是这样的：

<div data-bind="foreach: { data: allowanceList, as: '_allowance'}">
  <div style="display : block; width : 100%">
    <span data-bind="text : allowanceTitle"></span>
  </div>
  <div style="margin-left : 20px" data-bind="foreach: { data: _allowance.fields, as: '_field'}">
    <div style="display : block; width : 100%">
      <label data-bind="text : title"></label>
      <!-- ko if : typeOfField() == "input"-->
      <input data-bind="value : _allowance[_field.allowanceVariable()]" />
      <!-- /ko -->
    </div>
  </div>
</div>

Updated fiddle

请注意，我们可以让它在没有别名的情况下工作。像这样使用$parent和$data binding contexts：

<div data-bind="foreach : allowanceList">
  <div style="display : block; width : 100%">
    <span data-bind="text : allowanceTitle"></span>
  </div>
  <div style="margin-left : 20px; display : block; width : 100%" data-bind="foreach : fields">
    <div style="display : block; width : 100%">
      <label data-bind="text : title"></label>
      <!-- ko if : typeOfField() == "input"-->
      <input data-bind="value : $parent[$data.allowanceVariable()]" />
      <!-- /ko -->
    </div>
  </div>
  <br/>
</div>

Updated Fiddle

但是，我认为前一种方法更清晰，更容易理解。顺便创造整洁小提琴的好东西：）

Answer 2

通过在模型中使用函数，可以实现所需的结果。以下是演示答案的小提琴。

https://jsfiddle.net/divekarvinit/9fq59gfc/1/

在这里，我调用了内部for循环的size_t word_count = 0; do { fscanf(inFile, "%*s"); } while (!feof(inFile) && ++word_count);模型的dynamicValue函数我已将Field个对象传递给它。

在函数中，我检查了$parent的值，并相应地返回了allowanceVariable模型的相应变量的值。

如果适用于此解决方案，请建议任何其他更好的解决方案，我必须在Allowance函数中硬编码Allowance模型的属性名称，但这肯定解决了我的问题。

使用Knockout动态绑定字段

2 个答案: