我有一个 mat-select,里面有 5 个 mat-options 可供选择。每个 mat-option 在其中有两行是 h2 标签。如何使选择显示在两条线各自的线上?它们当前在没有空格的情况下一个接一个地显示,即使它们在选项下拉部分中具有正确的格式。任何帮助,将不胜感激。这是我的代码。提前致谢。
<mat-form-field>
<div>
<mat-select [(value)]="selected">
<mat-option value="default">
<h2>Select a Product</h2>
<h2>
Expand to see a list of eligible products
</h2>
</mat-option>
<mat-option
class="options"
*ngFor="let Product of Products"
[value]="Product"
>
<h2 class="title">{{ Product.Name }}</h2>
<h2>{{ Product.Type }}</h2>
</mat-option>
</mat-select>
</div>
</mat-form-field>
::ng-deep .mat-select-value-text {
word-wrap: break-word;
white-space: normal;
height: 70px;
}