Question

我有一个变量，我的应用程序的用户可以修改，例如：

let myValue = 3;

在我的html中，我希望创建一个与变量值一样多的元素重复项。

在我的情况下，myValue is 3，然后创建div元素3次。

<div>I am a duplicate.</div>
<div>I am a duplicate.</div>
<div>I am a duplicate.</div>

myValue也可以是更高或更低的数字。无论是什么，我都希望元素有很多重复。我该如何实现？

P.S。我仍然对Angular和Typescript还是陌生的，所以如果这是一个非常简单的问题，请不要对我加倍努力。

Answer 1

// creates an array in TS file based on myValue
duplicates = Array(myValue).fill(null).map( (x,index) => index );


// use ngFor in HTML 
<div ngFor="let duplicate of duplicates">
  <div>I am a duplicate. {{ duplicate }}</div>
</div>

Answer 2

这可以使用迭代器协议完成。

HTML

AddSession()

TypeScript

<ol>
  <li *ngFor="let i of value">{{ i }}</li>
</ol>

打字稿-有条件地创建重复元素

2 个答案: