用 *ngFor 分隔数组元素

Question

我正在做一项我必须做的作业，使用 Angular，随机生成 12 个数字并将它们放入列表中（每个列表元素一个数字）。

现在我得到的结果是每 od 12 个列表项看起来都一样，即

1674,4769,3549,7093,6751,6277,2980,427,2358,257,5558,8331

我找不到关于如何将每个随机数字放在单独项目符号中的解决方案。

HTML:

<button (click)="generateNumbers()">Wygeneruj liczby</button>
<li *ngFor="let number of randomNumbers">
  {{ randomNumbers }}
</li>

component.ts

public randomNumbers: number[];

  generateNumbers(){
    let array: number[] = [];
    while (array.length <12 ) {
      array.push(Math.floor(Math.random() * 8719));
    }
    this.randomNumbers = array;
  }

我在这里错过了什么？

提前感谢您的任何建议！ :)

Answer 1

这是您需要做的

<div>
  <button (click)="generateNumbers()">Wygeneruj liczby</button>
  <ul>
    <li *ngFor="let number of randomNumbers">
      {{ number }}
    </li>
  </ul>
</div>

Demo

用 *ngFor 分隔数组元素

Separate array elements with *ngFor

angular

random

ngfor