出于某种原因，无论我使用什么格式来构建 ngSwitch，唯一有效的指令是 *ngSwitchDefault。
这是我的代码:
<div class="icon-group" [ngSwitch]="published?.availableOn">
<mat-icon *ngSwitchCase="Android" fontSet="fontawesome" fontIcon="fa-android" class="green-icon"></mat-icon>
<mat-icon *ngSwitchCase="Windows" fontSet="fontawesome" fontIcon="fa-windows" class="blue-icon"></mat-icon>
<mat-icon *ngSwitchCase="iOS" fontSet="fontawesome" fontIcon="fa-apple"></mat-icon>
<mat-icon *ngSwitchCase="Web" fontSet="fontawesome" fontIcon="fa-internet-explorer"></mat-icon>
<ng-container *ngSwitchCase="AndroidiOS">
<mat-icon fontSet="fontawesome" fontIcon="fa-android" class="green-icon"></mat-icon>
<mat-icon fontSet="fontawesome" fontIcon="fa-apple"></mat-icon>
</ng-container>
<mat-icon *ngSwitchDefault fontSet="fontawesome" fontIcon="fa-internet-explorer"></mat-icon> >
</div>
最佳答案
问题是，在评估字符串时，您必须将它们放在单引号中，因此修复非常简单:
<div class="icon-group" [ngSwitch]="published?.availableOn">
<mat-icon *ngSwitchCase=" 'Android' " fontSet="fontawesome" fontIcon="fa-android" class="green-icon"></mat-icon>
<mat-icon *ngSwitchCase=" 'Windows' " fontSet="fontawesome" fontIcon="fa-windows" class="blue-icon"></mat-icon>
<mat-icon *ngSwitchCase=" 'iOS' " fontSet="fontawesome" fontIcon="fa-apple"></mat-icon>
<mat-icon *ngSwitchCase=" 'Web' " fontSet="fontawesome" fontIcon="fa-internet-explorer"></mat-icon>
<ng-container *ngSwitchCase=" 'AndroidiOS' ">
<mat-icon fontSet="fontawesome" fontIcon="fa-android" class="green-icon"></mat-icon>
<mat-icon fontSet="fontawesome" fontIcon="fa-apple"></mat-icon>
</ng-container>
<mat-icon *ngSwitchDefault fontSet="fontawesome" fontIcon="fa-internet-explorer"></mat-icon>
</div>
关于AngularX ngSwitch 始终使用 ngSwitchDefault，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51560421/