使用带有if绑定的$ index的knockout.js

时间:2022-12-03 07:39:38

I'm trying to show some mark up based on the value of $index, I can display the value but I can't seem to use it with an if binding, what's the best approach here?

我试图根据$ index的值显示一些标记,我可以显示值,但我似乎无法使用if绑定,这里最好的方法是什么?

<!-- ko if: $index===0 -->
  <div>some mark up here</div>
<!-- /ko -->

2 个解决方案

#1


131  

$index is an observable, and observables are functions. When you use observables in an expression you must use the () form to access the value.

$ index是一个可观察的,可观察的是函数。在表达式中使用observable时,必须使用()表单来访问该值。

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

#2


11  

From the knockout bindings page

来自淘汰赛绑定页面

$index (only available within foreach bindings)

$ index(仅在foreach绑定中可用)

This is the zero-based index of the current array entry being rendered by a foreach binding. Unlike the other binding context properties, $index is an observable and is updated whenever the index of the item changes (e.g., if items are added to or removed from the array).

这是由foreach绑定呈现的当前数组条目的从零开始的索引。与其他绑定上下文属性不同,$ index是一个可观察的,并且只要项目的索引发生更改(例如,如果项目被添加到数组中或从数组中删除)就会更新。

Example

<div data-bind="foreach: details.additionalDetails">
    <!-- ko if: $index() !== 0 -->
        <span> | </span>
     <!-- /ko -->
        <span data-bind="text: name"></span> <span data-bind="text: value"></span>
</div>

Results in

结果是

Model #: UAI5021 | Catalog #: UIOY786

#1


131  

$index is an observable, and observables are functions. When you use observables in an expression you must use the () form to access the value.

$ index是一个可观察的,可观察的是函数。在表达式中使用observable时,必须使用()表单来访问该值。

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

#2


11  

From the knockout bindings page

来自淘汰赛绑定页面

$index (only available within foreach bindings)

$ index(仅在foreach绑定中可用)

This is the zero-based index of the current array entry being rendered by a foreach binding. Unlike the other binding context properties, $index is an observable and is updated whenever the index of the item changes (e.g., if items are added to or removed from the array).

这是由foreach绑定呈现的当前数组条目的从零开始的索引。与其他绑定上下文属性不同,$ index是一个可观察的,并且只要项目的索引发生更改(例如,如果项目被添加到数组中或从数组中删除)就会更新。

Example

<div data-bind="foreach: details.additionalDetails">
    <!-- ko if: $index() !== 0 -->
        <span> | </span>
     <!-- /ko -->
        <span data-bind="text: name"></span> <span data-bind="text: value"></span>
</div>

Results in

结果是

Model #: UAI5021 | Catalog #: UIOY786