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。