Как я могу предотвратить повторный рендеринг при изменении размера окна или потере фокуса под углом 6 - PullRequest
Новая
       32

Как я могу предотвратить повторный рендеринг при изменении размера окна или потере фокуса под углом 6

0 голосов
/ 16 ноября 2018

У меня есть компонент в Angular 6.0.8, который содержит только iframe.

page.component.html: 

<iframe [src]="url">

page.component.ts: 

ngOnInit() {
    this.url = this.route.snapshot.data['url];
}

Теперь, когда я изменяю размер окна или щелкаю мышью за пределами компонента (потерял фокус), angular будет перерисовывать его (показывает жизненный цикл: DoCheck, AfterContentChecked, AfterViewChecked)

И браузер будетзапросить URL-адрес в iframe снова, что я не должен.

Как предотвратить такое поведение?

1 Ответ

0 голосов
/ 16 ноября 2018

Один из наиболее рекомендуемых способов (чтобы решить не эту конкретную проблему, а все ненужные повторные отображения) - это использовать стратегию обнаружения изменений при нажатии (ChangeDetectionStrategy.OnPush).

Полное руководство по стратегии обнаружения изменений углового толчка

По умолчанию Angular использует стратегию обнаружения изменений ChangeDetectionStrategy.Default.

Стратегия по умолчанию ничего не подразумевает в приложении, поэтому каждый раз, когда что-то меняется в нашем приложении, в результате различных пользовательских событий, таймеров, XHR, обещаний и т. Д. Обнаружение изменений будет выполняться для всех компонентов.

Это означает, что что-либо от события щелчка до данных, полученных от вызова ajax, вызывает срабатывание обнаружения изменения.

...

Стратегия обнаружения изменений OnPush

Мы можем установить для ChangeDetectionStrategy нашего компонента значение ChangeDetectionStrategy.OnPush.

Пример: 

@Component({
  selector: 'tooltip',
  template: `
   <h1>{{config.position}}</h1>
    {{runChangeDetection}}
  `,
  changeDetection: ChangeDetectionStrategy.OnPush
})
...