列表視圖不顯示正確的文本

Question

我想在混合移動應用程序中創建一個列表視圖。在每個Cell中，我想要添加的數據超過其寬度。我只想顯示一行，剩餘的數據將被隱藏。在這一行中，我想只顯示完整的單詞，不希望任何單詞被截斷。

我使用Angular的離子框架。

我也得到了一個解決方案，但也截斷了單詞即省略號。

例子：我的要求是 在列表查看電池的輸出應該是「四個得分87年前，我們的祖先在這塊大陸帶來一個新的」 不「四個得分和87年前，我們在這個大陸上產生的父親「。

Answer 1

謝天謝地，有一個離子css類來實現你所需要的。使用item-text-wrap類上的列表項，像這樣：

<div class="item item-text-wrap"> 
    This is a basic Card which contains an item that has wrapping text. 
</div> 

或

<ion-item class="item-text-wrap"> 
{{textThatMayBeTooLong}} 
</ion-item> 

看here以供參考。