javascript - Bir şey null olmadığına kadar nasıl bekleyip sonra fonksiyonu çalıştırabilirim

Şu anda bu highlight fonksiyonu ngOnInit üzerinde çağrılıyor, ancak DOM'a eklenen metnin DOM'a yazılması bir saniye kadar sürüyor.

Bu nedenle, fonksiyon çalıştırıldığında null döndürüyor ve orada metin bekliyor. document.getElementById('scrollable') === null olmadığında bu fonksiyonu nasıl çalıştırabilirim?

Şu ana kadar bunu çalıştırabilmenin tek yolu 800ms zaman aşımı ile oldu ama bu iyi değildi çünkü bazı insanların internet hızı diğerlerinden daha yavaş, bu yüzden internet veya bilgisayar sayfayı yüklemekte daha uzun sürerse sorunlara yol açardı.

Birkaç farklı yol denedim ama hiçbiri işe yaramadı. Eğer kimsenin iyi bir tavsiyesi varsa lütfen bana söylemekten çekinmesin.

highlight(words) {
      const high = document.getElementById('scrollable');
      const paragraph = high.innerHTML.split(' ');
   }
}

Şu anda Angular 6 kullanıyorum.

HTML: https://gist.github.com/ElAndy94/fa78b5b25a73716e2c32045c6c6be1ff

TS: https://gist.github.com/ElAndy94/85950e0e84aad30a72d3b91faa7d6278

Cevap #1

Angular Bileşen Yaşam Döngüsüne bir göz atmanızı öneriyorum. Görünümünüzün başlatıldığından emin olmak için AfterViewInit kancasını kullanmalısınız.

import { Component, AfterViewInit } from '@angular/core';

@Component({...})
export class MyOwnComponent implements AfterViewInit {

  constructor() { }

  ngAfterViewInit() { // Here your view is checked and initialized.
    this.highlight();
  }

  highlight(words) {
    const high = document.getElementById('scrollable');
    const paragraph = high.innerHTML.split(' ');
    ...
  }

}