首页 > 解决方案 > ionic 2/3 检查标签文本是否被截断或不将其用作条件

问题描述

我有这些标签和这个按钮

...let item of items...
<ion-label *ngIf="item.textwrap" text-wrap>{{item.record_view}}
</ion-label>
<ion-label *ngIf="!(item.textwrap)" >{{item.record_view}}
</ion-label>
<button ion-button (click)="textWrap(item)" clear item-right >
    <ion-icon name="more"></ion-icon>
</button>

此代码的目的是在按下按钮时显示所有文本。这个解决方案一点也不优雅,我一点也不喜欢它,但经过多年的搜索,我只能做到这一点。

我最好只在标签文本实际被截断时才添加按钮,例如:

<ion-label [ngStyle]="ITEM.WRAPTEXT" >{{item.record_view}}
</ion-label>
<button ion-button *ngIf="IS_LABEL_TRUNCATED" (click)="textWrap(item)" clear item-right >
    <ion-icon name="more"></ion-icon>
</button>

在 .ts 文件中使用状态变量,例如

textWrap(item){
  if(item.textwrap==""{
    item.textwrap = "text-wrap" //or true
  }else{
    item.textwrap = "" //or false
  }
}

你们有什么解决方案可以达到这样的结果吗?

感谢大家

标签: angularionic2ionic3

解决方案


推荐阅读