ionic 4 离子选择选项文本换行

Question

我无法将文本包裹在我的 ion-select-option 中。

 <ion-list> <ion-list-header>Select one of your work orders</ion-list-header> <ion-item> <ion-select [(ngModel)]="selection" (ionChange)="optionsFn(selection)"> <ion-select-option [value]="work" *ngFor="let order of workOrder">{{order.destination}} - {{order.startDate | date: "MM/dd/yyyy"}} - {{order.endDate | date: "MM/dd/yyyy"}}</ion-select-option> </ion-select> </ion-item> </ion-list>

我实际上看到了使用以下 CSS 的解决方案

 .alert-radio-label.sc-ion-alert-ios { padding-left: unset; padding-right: unset; -webkit-padding-start: 13px; padding-inline-start: 13px; -webkit-padding-end: 13px; padding-inline-end: 13px; white-space: pre-wrap; }

如果我添加空格： pre-wrap; 在控制台调试器中，来自 ion-select 的文本将使用以下内容成功包装：

问题是，如果我将其添加到 css 中，则它不会生效。 所以我不确定应该在哪里添加。 在另一篇文章中，有人建议将其添加到 app.css 中，但我的 ionic 4 项目中没有全局 app.css。

Answer 1

由于警报 html 在您的组件之外，您需要将其添加到您的应用程序的全局 CSS 中...在 Ionic 4 生成的项目中，您可以使用 global.scss，如果找不到或它不起作用......使用variables.scss，虽然我认为你可以只使用global.scss。