如何在离子选项标签中添加新行？答案

【问题标题】：How to add new line in ion-option tag?如何在离子选项标签中添加新行？
【发布时间】：2019-05-23 18:00:17
【问题描述】：

需要在下拉列表中的公司名称后换行。

我什么都试过了，也插入<p> & <br> 标签。

<ion-item>
    <ion-label>select</ion-label>
    <ion-select okText="Okay" cancelText="Dismiss">
    <ion-option value="1"> company1 address1</ion-option>
    <ion-option value="2">company2  address1</ion-option>
    <ion-option value="2">company3 address3</ion-option>
    <ion-option value="4">company4 address4</ion-option>
    </ion-select>
 </ion-item>

我想在新行中显示一个地址。我也在公司和地址之间尝试了一个 HTML 标签。公司和地址是两个不同的文本。

使用标签后，显示在同一行。

更新：我知道 HTML 标签在 ion-option 中不起作用。有没有人在 ionic 中遇到过同样的事情。

【问题讨论】：

标签： ionic-framework

【解决方案1】：

将html注入离子元素有点尴尬，但你可以绕过它

css.

page-home {
    .select-text{
        white-space: normal;
        width: min-content;
        word-spacing: 9999px;
    }
}

好好讨论一下Can CSS force a line break after each word in an element?

希望对你有帮助

【讨论】：