数据绑定foreach一个可观察的数字

Question

I am trying to display stars for each item in a list

I have an interface that has the 5-star score on a video, how do I do a foreach for the count of that score? rather than creating an array for the score?

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

You could either use Array.from() or the Array(score) to create an array from the score

Array.from({ length: score })

or

[...Array(score)]

(Use score() if it's an observable )

Here's a minimal snippet:

 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>