数据绑定 foreach 以获得可观察的数字

Question

我正在尝试为列表中的每个项目显示星标

我有一个视频的界面有 5 星评分，我该如何为该评分的计数执行 foreach？而不是为分数创建数组？

interface Video{
    Score: number;
}

<td>
    <span data-bind="foreach: score">
       <span class="glyphicon-star"></span>
    </span>
    <span data-bind="foreach: 5 - score">
       <span class="glyphicon-star-empty"></span>
    </span>
</td>

Answer 1

您可以使用 Array.from() 或 Array(score) 从分数创建数组

Array.from({ length: score })

或

[...Array(score)]

（如果是 observable，则使用 score()）

这是一个最小的片段：

const model = {
  score: 3
}

ko.applyBindings(model)

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-min.js"></script>

<span data-bind="foreach: Array.from({ length: score })">
   <span class="glyphicon-star">*</span>
</span>

数据绑定 foreach 以获得可观察的数字

data-bind foreach for an observable number

knockout.js

typescript

knockout-binding-handlers