Angular在component.html中的3种Ifelse条件

html5 • • 问答

我正在使用 Angular 12，在我的 component.html 中，我需要有一个 3 级条件。

例如：

我有一个列表，我需要检查它是否包含字符串。

true 和 false 状态都有不同的输出，最后我需要针对任何其他条件进行 ELSE。

所以......首先我有一个条件：

<div *ngIf="list.includes('sometext') && listitem === null ">Condition 1</div>

现在的条件与上述相反：

<div *ngIf="!list.includes('sometext') && listitem === null ">Condition 2</div>

最后是ELSE：

<div>Condition 3 or Any other condition from the others above</div>

我怎样才能做到这一点？

回答

解决这个问题的最好方法是使用ngSwitchCaseinsead of ngIf ，如下所示：

<container-element [ngSwitch]="true">
   <some-element *ngSwitchCase="list.includes('sometext') && listitem === null ">...</some-element>
   <some-element *ngSwitchCase="!list.includes('sometext') && listitem === null ">...</some-element>
   <some-element *ngSwitchDefault>Condition 3 or Any other condition from the others above</some-element>
</container-element>

以上是Angular在component.html中的3种Ifelse条件的全部内容。
THE END
分享
二维码
< <上一篇
下一篇>>