我正在使用 ngFor 用选项填充我的选择。
<select>
<option *ngFor='let item of items; let i = index, [value]='item.name',)> {{ item.label }} </option>
</select>
我想在某个选项后添加分隔线。所以像这样
Item1
Item 2
-- Divider --
Item 3
我已经通过使用索引显示分隔线了
<option *ngFor='let item of items; let i = index, [value]='item.name',)> {{ item.label }} {{ i == 2 ? '----' : ''}}</option>
但我似乎无法将其放到自己的行中。
关于如何做到这一点有什么建议吗?另外,任何关于如何拥有比 --- 更好看的分隔器的建议将不胜感激。
谢谢!
最佳答案
使用*ngFor
在<ng-container>
上元素。然后您可以为每个数组项添加多个子元素。
示例:
<select>
<ng-container *ngFor="let item of items;">
<option [value]="item.value">{{item.name}}</option>
<option *ngIf="item.name === 'foobar'" disabled="disabled">----</option>
</ng-container>
</select>
关于Angular - 如何使用 ngFor 在选择选项之间添加分隔线?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54672983/