0

我有一个 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;

}

4

0 回答 0