Как узнать, что ChangeDetection был выполнен на конкретном компоненте?

Я изучаю, как ChangeDetection работает в Angular.

Один из способов вызвать ChangeDetection - запустить метод detectChanges():

constructor(cd: ChangeDetectorRef) { 
  setTimeout(_ => cd.detectChanges(), 3000)
}

Он выполнит обнаружение изменений в компоненте, но не коснется каких-либо хуков жизненного цикла компонента.

Итак, если вы попытаетесь выполнить ngDoCheck или ngAfterViewChecked внутри одного и того же компонента:

  ngDoCheck() {
    console.log('ChangeDetection')
  }

  ngAfterViewChecked() {
    console.log('ChangeDetection')
  }

вы ничего не получите в консоли.

Здесь вы можете поиграть с кодом - https://stackblitz.com/edit/ng-cd-check?file=src%2Fapp%2Fhello.component.ts

Итак, мой вопрос:

Is there a general way (that will work for all the cases) to define that ChangeDetection was executed on a specific component?

angular angular-changedetection
person Stepan Suvorov    schedule 14.12.2020    source источник
comment
Совершенно уверен, что он должен запускать хуки: github.com/angular/angular/blob/11.0.4/packages/core/src/ Может быть, ошибка?   -  person waterplea    schedule 15.12.2020
comment
Отметьте this, в частности, вызывает OnInit и ngDoCheck для дочернего компонента (OnInit вызывается только во время первой проверки), поэтому он вызывается для дочернего < / b> компонент. Он выполнит обнаружение изменений в компоненте, но не коснется каких-либо хуков жизненного цикла компонента. - поскольку он не должен этого делать, он касается их на дочернем компоненте   -  person Max Koretskyi    schedule 15.12.2020

Ответы (1)


arrow_upward
0
arrow_downward

Я нашел простое решение, когда внутри шаблона я поместил фиктивную функцию:

{{realDoCheck()}}

и, как мы знаем, функция будет всегда вызываться, когда CD пытается повторно визуализировать шаблон, поэтому:

  realDoCheck() {
    console.log('CD triggered')
  }

вот полный пример кода - https://stackblitz.com/edit/ng-cd-check-dyudp6?file=src%2Fapp%2Fhello.component.ts

person Stepan Suvorov    schedule 30.12.2020