angular2逗号在表格单元格后的新行

Question

我使用* ngFor从mongoDB动态填充表格。在其中一个单元格中，我有一个字符串数组，如string1，string2，string3，string4。如何显示的字符串为：
字符串1，
字符串2，
STRING3，
串，4

这里是我的代码：

<tbody> 
    <tr *ngFor="let audit of audits "> 
     <td>{{ audit.installDate | date:"medium" }}</td> 
     <td>{{ audit.appName }}</td> 
     <td>{{ audit.environment }}</td> 
     <td>{{ audit.userName }}</td> 
     /*This is the line with the string[] 
     <td>{{ audit.fqdNs }}</td> 
    </tr> 
</tbody> 

在我component.ts我做

export class HomeComponent implements OnInit { 
public audits: AuditItem[]; 

constructor(private _dataService: AuditService) { 
}  

ngOnInit() { 
    this._dataService 
     .getAll() 
     .subscribe((data: AuditItem[]) => this.audits = data, 
     error => console.log(error), 
     () => console.log("getAllItems() complete from init " + this.audits)); 
} 

谢谢你的帮助。

Answer 1

您可以使用嵌套ngFor。

<tbody> 
    <tr *ngFor="let audit of audits "> 
     <td>{{ audit.installDate | date:"medium" }}</td> 
     <td>{{ audit.appName }}</td> 
     <td>{{ audit.environment }}</td> 
     <td>{{ audit.userName }}</td> 
     <td> 
     <div *ngFor="let fqdN of audit.fqdNs; let lastItem = last"> 
      <span>{{fqdN}}</span><span *ngIf="!lastItem">,</span> 
     </div> 
     </td> 
    </tr> 
</tbody> 

Answer 2

加入字符串在地图中，并在表使用innerHTML属性后绑定

this._dataService 
    .getAll() 
    .map(x => Object.assign({}, x, {fqdNs: x.fqdNs.join("</br>")}))