ng-switch не работает, даже если isactive - false - PullRequest
0 голосов
/ 03 мая 2019

В ng-switch есть две кнопки, если isActive имеет значение 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>


Активировать

Ответы [ 3 ]

1 голос
/ 03 мая 2019

Угловой нг-переключатель будет оценивать вашу 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>
1 голос
/ 03 мая 2019

Вы не хотите использовать здесь 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>
1 голос
/ 03 мая 2019

Я бы предложил использовать 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> 
...