есть ли способ прослушать событие завершения обнаружения изменения в angular - PullRequest
0 голосов
/ 28 февраля 2020

У меня есть компонент, который содержит iframe, но видимый (*ngif) только после вызова http.

<iframe id="myFrame" [src]="url | sanitizeUrl" *ngIf="showIFrame "></iframe>

Вот метод getData, который включает свойство showIFrame .

this.getData().subscribe(
  (_response: string) => {
     this.showIFrame = true;
     setTimeout(() => {
         this._listenClickOnIframe();
     }, 100);
});

на основе showIFrame iframe является видимым.

У меня есть еще один метод _listenClickOnIframe, который добавляет событие onclick к iFrame. Этот метод находится внутри setTimeout с 100ms wait. Если я не использую setTimeout, метод _listenClickOnIframe выполняется перед изменением DOM, и в DOM нет iFrame.

Есть ли другой способ справиться с этим? Для некоторых медленных машин 100ms (случайное количество миллисекунд) может быть недостаточно, и я думаю, что это не очень хороший подход.

Я ищу вид события, когда обнаружение изменения завершено, есть ли способ или лучший подход решать такие ситуации?

1 Ответ

1 голос
/ 28 февраля 2020

Вы должны прослушать событие load в iframe и начать слушать только тогда:

<iframe id="myFrame" [src]="url | sanitizeUrl" *ngIf="showIFrame" (load)="_listenClickOnIframe()"></iframe>

LE:

Для общих правил жизненного цикла angular я рекомендую прочитать документацию здесь: https://angular.io/guide/lifecycle-hooks.

Последним хуком, который вызывается (после рендеринга), является ngAfterViewChecked, но, возможно, он вам необязательно (его использование может повлиять на производительность вашего приложения, так как он вызывается довольно часто).

Вот еще одна ссылка, объясняющая различные хуки и их использование: https://guide.freecodecamp.org/angular/lifecycle-hooks/

...