ng-switch不起作用，即使是iSActive是错误的

Question

ng-switch中有两个按钮，如果iSActive是错误的，则应显示两个按钮，但它显示两个按钮。我在做什么？

<div ng-switch="user.IsActive">
  <div ng-switch-when="false">
  <button type="button" (click)="activateDeactivateUser(user.UserId,user.IsActive)" class="btn btn-primary active">Deactivate</button>
    </div>

启用

Answer 1

您不想在这里使用ngswitch，而是一个ngif：

<div *ngIf="user.IsActive">
  <button type="button" (click)="activateDeactivateUser(user.UserId,user.IsActive)" class="btn btn-primary active">Deactivate</button>
</div>

当user.isactive变量返回true时，该按钮将显示。当它返回false时，该按钮将被隐藏。

在单独的音符上，您的ngswitch语法不正确。正确的语法遵循以下模式：

<div [ngSwitch]="variableCondition">
    <component1 *ngSwitchCase="variableCondition1"></component1>
    <component2 *ngSwitchCase="variableCondition2"></component2>
</div>

Answer 2

Angular ng-switch会评估您的false，而不是 boolean value，因此将开关案例更改为ng-switch-when="'false'"

示例

<div ng-switch="user.IsActive">
                                                    <div ng-switch-when="'false'">
                                                        <button type="button" (click)="activateDeactivateUser(user.UserId,user.IsActive)" class="btn btn-primary active">Deactivate</button>
                                                    </div>
                                                    <div ng-switch-default>                                                                
                                                        <button type="button" (click)="activateDeactivateUser(user.UserId,user.IsActive)" class="btn btn-primary active">Activate</button>
                                                    </div>
                                            </div>

Answer 3

我建议将ng-if用于布尔值。

<div>
  <div ng-if="user.IsActive">
    <button type="button" (click)="activateDeactivateUser(user.UserId,user.IsActive)" class="btn btn-primary active">Deactivate</button>
  </div>
  <div ng-if="!user.IsActive">
    <button type="button" (click)="activateDeactivateUser(user.UserId, user.IsActive)" class="btn btn-primary active">Activate</button>
  </div>
</div>

这是NG-SWitch

的一个例子

<div ng-switch="user.IsActive">
  <div ng-switch-when="true'">
    <button type="button" (click)="activateDeactivateUser(user.UserId,user.IsActive)" class="btn btn-primary active">Deactivate</button>
  </div>
  <div ng-switch-when="false">
    <button type="button" (click)="activateDeactivateUser(user.UserId, user.IsActive)" class="btn btn-primary active">Activate</button>
  </div>
</div>