Question

我有一段代码，我试图根据$ index值显示一些标记并将其与可观察值进行比较。

<div class='config-summary-chart-section'>
  <!-- ko foreach: codeCoverageStats -->
  <div class='config-stat-chart-section'>
  <div class='chart-heading' data-bind='text: lengthArray ' />
  <div class='chart-heading' data-bind='text: $index ' />                         
</div>        
<!-- ko if: $index() !== lengthArray -->                           
<div class='separator' />                                        
  <!-- /ko -->                                  
  <!-- /ko -->
</div>

我的class ='chart-heading'都按预期打印值。例如，如果lengthArray为4，则打印

4   4   4   4   4 
0   1   2   3   4

但if条件（$ index（）！== lengthArray）没有被最后一个索引所接受，我得到了我想要避免的最后一个分隔符类。这里出了什么问题？

Answer 1

您的lengthArray值很可能是一个字符串，与数字不同。确保数值的一种简单方法是在其前面添加+。在下面的示例中，索引4处的元素之后没有生成小时。

function la(lengthValue) {
  return {
    lengthArray: lengthValue
  };
}
vm = {
  codeCoverageStats: ko.observableArray([
    la(4),
    la(4),
    la(4),
    la(4),
    la('4'),
    la(4)
  ])
};

ko.applyBindings(vm);

.config-stat-chart-section > div {
  display: inline-block;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<div class='config-summary-chart-section'>
  <!-- ko foreach: codeCoverageStats -->
  <div class='config-stat-chart-section'>
    <div class='chart-heading' data-bind='text: lengthArray '></div>
    <div class='chart-heading' data-bind='text: $index '></div>
  </div>
  <!-- ko if: $index() !== +lengthArray -->
  <hr />
  <!-- /ko -->
  <!-- /ko -->
</div>

Answer 2

现在我们只能猜测你的视图模型结构。

如果＆＃34; lengthArray＆＃34;是一个可观察的，你需要展开它的价值：

<!-- ko if: $index() !== lengthArray() -->

或

<!-- ko if: $index() !== ko.unwrap(lengthArray) -->

说明

当我们将它们用作计算参数时，我们应该展开observable。让我们说＆＃34; lengthArray＆＃34;是一个可观察的。这意味着＆＃34; lengthArray＆＃34;是一个函数（对函数的引用）。所以写

1 + lengthArray

是一个错误，因为您要添加两个不同的对象对象：数字和函数引用。

如果你写＆＃34; lengthArray（）＆＃34; - 你正在调用＆＃34; lengthArray＆＃34;函数并获取它可以在计算中使用的实际值：

1 + lengthArray()

如果你不知道＆＃34; lengthArray＆＃34;是否是可观察的，你可以使用KnockoutJS效用函数：＆＃34; ko.unwrap（lengthArray）＆＃34;获得操作的价值。

这就是KnockoutJS对绑定参数的作用。这就是为什么我们在使用绑定时无需手动执行此操作。

$ index如果绑定不起作用

2 个答案:

说明