2017-01-16 2 views
1

Это мой HTML-код, но как-то текст-обертка не работает в этом компоненте Select. У кого-нибудь есть идея?Ionic 2 Text does not Wrap in Select Component

<ion-list> 
    <h5 color="primary"> 
    Choose: 
    </h5> 

    <ion-item text-wrap> 
    <ion-select text-wrap class="selectWidth" okText="Ok" cancelText="Cancel" [selectOptions]="selectOptions" [(ngModel)]="Decision"> 
     <ion-option text-wrap selected="true" color="primary" value="vone" text-wrap>first first first first first</ion-option> 
     <ion-option text-wrap color="primary" value="vtwo">second second second second second second second</ion-option> 
     <ion-option text-wrap color="primary" value="vthree">third third third third third</ion-option> 
    </ion-select> 
    </ion-item> 
</ion-list> 
+0

вы пробовали настройки 'Пробельные: нормальный ; 'в классе' selectWidth' css? –

+0

Да, даже с важным тегом ... –

+0

Можете ли вы опубликовать полный код, как заставить это работать? Что входит в класс selectWidth? – user3561494

ответ

2

переопределить этот класс в вашем .sass

.alert-radio-label { 
    white-space: normal!important; 
} 
+0

Спасибо большое. Вы знаете, как изменить цвет окна оповещения, который также открывается? Кажется, это еще один класс, тогда .alert-radio-label –

+0

use: .alert-wrapper { background-color: purple! Important; } –

+0

исправлено. спасибо :) –

-1

Добавление следующей строки в main.css или app.scss должны решить эту проблему:

.alert-ios .alert-radio-label{ white-space: pre-line;} 
.alert-md .alert-radio-label{ white-space: pre-line;} 
.alert-wp .alert-radio-label{ white-space: pre-line;} 
.select-text { white-space: pre-line;}