Question

我需要你的帮助

我的代码如下：

      <mat-cell *matCellDef="let row">
        <span *ngIf="row.messageText.length >= 30">{{row.messageText.substr(0, 25)}}</span>
        <span *ngIf="row.messageText.length < 30">{{row.messageText.substr(0, 30)}}</span>
        <span *ngIf="(row.messageText == null) || (row.messageText === 'undefined'">.....</span>
      </mat-cell>

我不知道我是否正确使用ngIf指令。

如果messageText的长度超过或等于30，我需要使用＆＃34; row.messageText.substr（0,25）显示span。

如果row.messageText长度小于30，我需要用row.messageText.substr（0,30）显示span。

如果row.messageText为null或未定义，我想要＆＃34; .....＆＃34;在跨度。

请帮我正确使用ngIf。

Answer 1

在您提到的情况下，最好使用switch case语句，如下所示：

<div [ngSwitch]="true">
    <div *ngSwitchCase="row.messageText.length >= 30">
        <span>{{row.messageText.substr(0, 25)}}</span>
    </div>
    <div *ngSwitchCase="row.messageText.length < 30">
        <span>{{row.messageText.substr(0, 30)}}</span>
    </div>
    <div *ngSwitchCase="(row.messageText == null) || (row.messageText === 'undefined'">
        <span>...</span>
    </div>
    <div *ngSwitchDefault>
        <span></span>
    </div>
</div>

Answer 2

我在ngOnInit中定义了条件：

private condition: boolean = false;

ngOnInit(){
   this.condition = (row.messageText.length >= 30);
}

然后：

 <mat-cell *matCellDef="let row">
        <span *ngIf="row.messageText && condition">{{row.messageText.substr(0, 25)}}</span>
        <span *ngIf="row.messageText && !condition">{{row.messageText.substr(0, 30)}}</span>
        <span *ngIf="!row.messageText">.....</span>
      </mat-cell>

再见

Answer 3

实际上，你可以使用Pipe of Angular。

角4; ngIf声明;多种条件

3 个答案: