ngIf не запускается при обновлении переменной [(ngModel)] - PullRequest
Новая
       8

ngIf не запускается при обновлении переменной [(ngModel)]

0 голосов
/ 06 января 2020

У меня есть выбор с параметрами. У select есть директива [(ngModel)], сохраняющая выбранные значения в rightFieldTypeId. Затем у меня есть элементы, которые я хотел бы отобразить на основе значения «rightFieldTypeId». Строковая интерполяция rightFieldTypeId {{ rightFieldTypeId }} отображает правильное значение, когда я выбираю разные варианты (например, 1, 2 или 3). Тем не менее, мои элементы, основанные на директивах *ngIf, по-видимому, никогда не оценивают / изменяют. 

<div class="d-flex w-50">
    <select class="form-control w-25 mr-4" [(ngModel)]="rightFieldTypeId">
        <option *ngFor="let option of fieldTypeOptions" [value]="option.id">
            {{ option.name }}
        </option>
    </select>
    {{ rightFieldTypeId }}
    <span *ngIf="rightFieldTypeId === 2">This is Text</span>
    <edit-spec-wizard-operations-builder *ngIf="rightFieldTypeId === 3"></edit-spec-wizard-operations-builder>
</div>

Любое понимание того, как добиться отображения различных элементов с использованием директивы *ngIf на основе текущего значения, полученного из [(ngModel)]

1 Ответ

2 голосов
/ 06 января 2020
Значение

HTML option равно string, и сравнение со строгим сравнением (===) не приведет к принудительному типу, поэтому 2 === '2' будет false.

Таким образом, пара способов go с ним:

  1. Используйте двойное равенство сравнения - ==;
  2. Используйте +, чтобы сделать целое число из строка *ngIf="+rightFieldTypeId === 2", но с этим вы можете получить ошибку времени выполнения, если rightFieldTypeId не может быть приведен к целому числу;
  3. Просто сравните со строкой, потому что rightFieldTypeId всегда будет строкой *ngIf="rightFieldTypeId === '2'"
...