Angular *ngSwitchCase не выполняется

Я новичок в Ангуляре. Я использую ngSwitch в своей программе, но каждый раз, когда я запускаю программу, выполняется *ngSwitchDefault, а не *ngSwitchCase. Вот код:

<select [(ngModel)]="selectedControl" class="form-control">
    <option *ngFor="let inputControl of inputArray; let i=index" 
    [value]="inputControl">{{inputArray[i]}}</option>                                  
</select>
<span [ngSwitch]="selectedControl">
    <span *ngSwitchCase="text">
    <p>text is selected</p>              
    </span>
    <span *ngSwitchCase="radio">
    <p>radio is selected</p>
    </span>        
    <span *ngSwitchDefault>
    <p>Default value</p>
    </span>
</span>

angular ng-switch
person Waleed Shahzaib    schedule 17.10.2017    source источник
comment
Вам нужно сделать это строкой "'true'"   -  person Gerald Gonzales    schedule 17.10.2017

Ответы (3)


arrow_upward
1
arrow_downward

Оберните выражения *ngSwitchCase в выражения '', чтобы они стали strings. Сравнение будет использоваться с ===, поэтому string будет сравниваться с string. В вашем случае он найдет участника с именем radio или text и получит их значения, которые не определены.

<span [ngSwitch]="selectedControl">
    <span *ngSwitchCase="'text'">
    <!--                 ^----^ -->
    <p>text is selected</p>              
    </span>
    <span *ngSwitchCase="'radio'">
    <!--                 ^-----^ -->
    <p>radio is selected</p>
    </span>        
    <span *ngSwitchDefault>
    <p>Default value</p>
    </span>
</span>
person Suren Srapyan    schedule 17.10.2017

arrow_upward
0
arrow_downward

Согласно https://angular.io/api/common/NgSwitchCase ngSwitchCase ожидать expression не string . Если вы хотите использовать жестко заданную строку, замените *ngSwitchCase="text" на *ngSwitchCase="'text'"

person zucker    schedule 17.10.2017

arrow_upward
0
arrow_downward

В отличие от JavaScript, который использует строгое равенство, Angular использует свободное равенство. Это означает, что пустая строка "" соответствует 0.

https://angular.io/api/common/NgSwitchCase

person OliverE    schedule 25.07.2019
comment
Ответ только цитатой обычно слишком краток. Пожалуйста, будьте так любезны и добавьте предложение или два, чтобы связать цитату с вопросом. - person B--rian; 25.07.2019