Jak zawijać długi ciąg w pozycji jonowej

Question

IONIC ma dwa problemy z zawijaniem słów w pozycji jonowej: 1. Łańcuch zostanie obcięty przez kropki dodane na końcu, jak wyświetlić pełną treść bez kropek? 2. Automatyczne łamanie linii i reagowanie nie działają w Firefoksie (Chrome jest ok), jak rozwiązać ten problem w Firefoksie?

<div class="row responsive-sm"> 
<div class="col"> 
    <div class="item item-body"> 
     <ion-item class="wrap" style="word-wrap: break-word; word-break: break-all;"> 
     #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion 
     </ion-item> 
    </div> 
</div> 

Każda pomoc będzie mile widziane. Z poważaniem. Oto Pełna HTML, aby pokazać problemu codepen

Answer 1

Dla jonowego 1:

Wystarczy dodać item-text-wrapklasę do elementu.

<ion-item class="item-text-wrap"> 
     #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion #fashion 
</ion-item> 

Dla jonowej 2:

Wystarczy dodać text-wrapatrybut do elementu.

<ion-item text-wrap> 
    some long string 
</ion-item> 

Answer 2

Jeśli chcesz niestandardowej klasy CSS mieć taki sam efekt zawijania tekstu, wystarczy dodać

white-space: normal; 

do swojej klasy.

Źródło: ionic forum

Answer 3

W Ionic 2, użyć atrybutu text-wrap

<ion-item text-wrap> 
    text here wraps to multiple lines 
</ion-item>