Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
615 views
in Technique[技术] by (71.8m points)

ionic framework - How to wordwrap a long string in ion-item

IONIC has two problems about word-wrap in ion-item: 1. String would be truncated by the dots appended at the end, how to show full content without dots ? 2. Automatic line breaks and responsive are not working in Firefox (Chrome is ok), how to fix this problem in Firefox ?

<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>

Any help would be much appreciated. Best Regards. Here is Full HTML to show the problem codepen

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

For ionic 1:

Add item-text-wrap class to item.

<ion-item class="item-text-wrap">
  some long string
</ion-item>

For ionic 2:

Add text-wrap attribute to item.

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

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...