我正在创建一个 TypeScript 组件中的列表项,它将在用户界面中显示。这些列表项应该在不同行中显示。因此,我添加了换行符 \n 如下所示。但是列表项仍然显示在同一行上。以下是代码。有任何想法为什么它不起作用吗?
CSS 代码:
Typescript 代码:
@Output() excludeDisplay: any = '';
@Output() includeDisplay: any = '';
includeValues: any = '';
excludeValues: any = '';
this.includeValues += this.merId + ',' + this.explodeStatus + '\n';
console.log("include values are "+ this.includeValues);
this.excludeValues += this.merId + ',' + this.explodeStatus + '\n';
console.log("exclude values are "+ this.excludeValues);
this.includeDisplay = this.includeValues;
this.excludeDisplay = this.excludeValues;
Html 代码:
<ul id="excludedUl" required>{{ excludeDisplay }}</ul>
<ul id="includedUl" required>{{ includeDisplay }}</ul>
CSS 代码:
#includedUl {
float: right;
width: 33%;
}
#excludedUl {
float: right;
width: 33%;
}