Создать HTML на основе числа в массиве

Question

Впервые используя нокаут, извиняюсь за то, что может звучать глупо.

У меня есть массив данных. Одним из значений является "звезды", которое является числом. В моем HTML я хотел бы создать элементы HTML на основе этого значения. Например, если значение равно четырем, я бы хотел 4 элемента. Если значение 5, я бы хотел 5 элементов и так далее. У меня есть остальная часть привязки данных правильно, это та часть, в которой я не уверен.

Элемент, который я хотел бы продублировать, это "fa fa-star"

Данные

scores: [
    {
        title: 'Score One',
        stars: 5,
    },
}

HTML

<ul class="scores" data-bind="foreach: scores">
    <li>
       <div class="title" data-bind="text: title"></div>
       <div class="stars">
           <i class="fas fa-star"></i>
       </div>
     </li>
 </ul>

Answer 1

Если вы пытаетесь установить значение класса на значение звездочек (например, <div class="5">), то должно работать следующее:

<ul class="scores" data-bind="foreach: scores">
    <li>
       <div class="title" data-bind="text: title"></div>
       <div data-bind="attr: { class: stars }">
           <i class="fas fa-star"></i>
       </div>
     </li>
 </ul>

РЕДАКТИРОВАТЬ: после перечитывания вашего вопроса, это будет то, что вы ищете:

<ul class="scores" data-bind="foreach: scores">
    <li>
       <div class="title" data-bind="text: title"></div>
       <div data-bind="foreach: new Array(stars)"> // <-- replaced scores with stars
           <i class="fas fa-star"></i>
       </div>
     </li>
 </ul>