在Angular2组件的单独行中显示列表的每个元素

Question

我有一个Angular2组件来显示某些数据中的发言人列表。当我将以下代码放入xyz.component.html时，它会将列表显示为逗号分隔的字符串。如何在不同的行中显示每一个 - 基本上在每一行之后都有一个换行符。

<div *ngIf="data.speakers">
    <span class="attr-key">Speakers:</span><br>
    <span class="attr-value">{{data.speakers}}</span>
</div>

data是绑定带来的。它有一个名为speaker的元素，定义为string[]。

Answer 1

您需要使用 ngFor 来循环数据并显示

<ul>
    <li *ngFor="let speaker of data.speakers">
      {{ speaker}}
    </li>
</ul>