У меня «выражение изменилось после проверки ошибки», если я использую * ngif, но оно не появляется, если я использую [скрытый] - PullRequest
Новая
       27

У меня «выражение изменилось после проверки ошибки», если я использую * ngif, но оно не появляется, если я использую [скрытый]

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

У меня есть большое сомнение, случай 1 выдает ошибку, но если я заменяю случай 2, он не завершается.

Случай 1: 

 <div class="col-8" *ngIf="customstreetType">
    <app-input-text
      [valueIn]="_address?.custom_street_type"
      (valueOut)="_address.custom_street_type = $event; change()"
    ></app-input-text>
  </div>

Случай 2: 

  <div class="col-8" [hidden]="!customstreetType">
    <app-input-text
      [valueIn]="_address?.custom_street_type"
      (valueOut)="_address.custom_street_type = $event; change()"
    ></app-input-text>
  </div>

Ошибка: 

DemandsActionAddressComponent.html:21 ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: 'ngIf: false'. Current value: 'ngIf: true'.
    at viewDebugError (core.js:7594)
    at expressionChangedAfterItHasBeenCheckedError (core.js:7582)
    at checkBindingNoChanges (core.js:7684)
    at checkNoChangesNodeInline (core.js:10545)
    at checkNoChangesNode (core.js:10534)
    at debugCheckNoChangesNode (core.js:11137)
    at debugCheckDirectivesFn (core.js:11065)
    at Object.eval [as updateDirectives] (DemandsActionAddressComponent.html:21)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:11054)
    at checkNoChangesView (core.js:10433)

Я не понимаю, почему это происходит.* ngIf быстрее, чем [скрытый] или что-то в этом роде?

Ответы [ 2 ]

2 голосов
/ 27 мая 2019

Они работают по-разному. *ngIf может поместить или удалить компонент внутри DOM (и все, что с ним связано, например, запуск соответствующих хуков жизненного цикла, ngOnInit, ngOnChanges, ngOnDestroy и т. Д. Для элемента и каждого элемента внутри него).

Между тем, [hidden] добавляет атрибут «скрытый» к элементу, но не влияет на жизненный цикл компонентов.

0 голосов
/ 27 мая 2019

ngIF:

да!ngIF может быть медленным при добавлении удаления элементов в DOM из-за инициализаций

Ни один элемент DOM не добавляется, если ngIf оценивается как false.

Скрытый:

Будет добавлен элемент DOMв HTML

Поскольку элемент уже добавлен в DOM, отображение и скрытие выполняются очень быстро

...