javascript - 如何在 Angular2 中创建具有动态内容的动态数量的 div？

Question

我知道您会使用 ngFor，但我不太确定该怎么做。

基本上我想创建 n 次以下的 div，将 0 替换为 1 用于第二个 div，2 用于第三个 div，依此类推...

<div class="box">
    <p class="dut-text dut-title">
        {{list[0].data}}
    </p>
</div>

Answer 1

为 items 中的每个值创建下面的 div:

<div class="box" *ngFor="let item of items;let i=index">
    <p class="dut-text dut-title">
        {{list[i].data}}
    </p>
</div>

class MyComponent {
  items = ['a', 'b', 'c'];
}

更新

你的问题的另一种解释(见评论)

<div class="box" *ngFor="let item of list">
    <p class="dut-text dut-title">
        {{item.data}}
    </p>
</div>

class MyComponent {
  list = ['a', 'b', 'c'];
}