Angular: зачем мне вызывать cdr.markForCheck () для стратегии OnPu sh? Почему Detechanges () недостаточно? - PullRequest
Новая
       64

Angular: зачем мне вызывать cdr.markForCheck () для стратегии OnPu sh? Почему Detechanges () недостаточно?

0 голосов
/ 14 марта 2020

Я до сих пор не понимаю, в чем разница между cdr.detectChanges() и cdr.markForCheck() для OnPush стратегии обнаружения изменений из представления об использовании.

Даже если я прочитал это ТАК вопрос и InDepth объяснение.

Почему я не могу просто позвонить cdr.detectChanges()? Зачем мне нужно отмечать дерево от текущего компонента до root (или это связано с переносом на следующий цикл обнаружения)?

Или это как-то требуется обновить родительские компоненты?

В следующем примере оба способа работают: 

import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-test',
  template: `{{ i }}`,
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class TestComponent implements OnInit {
  private i = 0;

  constructor(private cdr: ChangeDetectorRef) { }

  ngOnInit() {
    setInterval(() => {
      this.i++;
      // this.cdr.detectChanges(); // this works too and updates view
      this.cdr.markForCheck();     // but this is for some reason recommended
    }, 1000);
  }
}

1 Ответ

1 голос
/ 14 марта 2020

detectChanges запускает цикл обнаружения изменений непосредственно для компонента
markForCheck делает так, как он называется, он просто отмечает компонент для проверки

В вашем примере вы запускаете setInterval, что означает, что changeDetection запускается setInterval, но запускается в вашем компоненте в следующем цикле.

Это потому, что NgZone делает что-то вроде обезьяньего патча для всех API по умолчанию, которых он может достичь, чтобы запустить changeDetection. При использовании Pu sh вы подключаетесь к своему компоненту и сообщаете angular о необходимости выполнения дополнительных проверок.

Если вы хотите получить более глубокие знания о NgZone и ChangeDetection, взгляните на это видео Angular Производительность: ваше приложение со скоростью света . Это содержит очень хорошие понятные сведения о ChangeDetection и о том, как работает NgZone, о котором должен знать каждый Angular Разработчик.

...