getElementByClass von HTML aus einer externen Quelle geholt -> undefined

Question

Ich hole HTML-Blöcke von einer externen Quelle mit HTTP-get und füge es in meine Anwendung mit innerHTML-Funktion. Ich versuche, mit dem Namen getElementsByClassName auf eine div-Klasse zuzugreifen. Dies ist, wie die respons wie folgt aussehen:

Wenn ich versuche, mit Indizierung eines der Objekte in der Liste zuzugreifen, (ex Ergebnis [0]), erhalte ich wieder nicht definiert. Weiß jemand, warum das passiert?

Danke!

Update:

Ich habe festgestellt, was das Problem war. Der HTML-Code wurde nicht richtig initialisiert, bevor ich versuchte, darauf zuzugreifen.

Dies ist meine Funktion, die HTML-Block aus meiner Serviceklasse holt.

getNewsFeed(){ 
     this.homeService.getNewsFeed() 
     .subscribe(res => 
     this.news_block = res, 
     error=>this.news_feed_error=true, 
     ()=> this.news_feed_error=false 
    ); 

getNewsfeed ausgeführt von:

ngOnInit(){ 
     this.getNewsFeed(); 
} 

Ich betreibe getElementByClassName in ngAfterViewInit

ngAfterViewInit(){ 
     console.log(document.getElementsByClassName("overlayWrapper")); 

    } 

ich die Antwort von getNewsFeed laden() in meine Wähler mit:

<div *ngIf="news_block" [innerHtml]="news_block"></div> 

Answer 1

Die o bservable gibt die Daten async zurück und anschließend wird der an .subscribe() übergebene Rückruf ausgeführt.

Es kann nicht garantiert werden, ob und wann die Daten ankommen. Es gibt keinen angularen Rückruf, der garantieren kann, dass getNewsFeed() ein Ergebnis zurückgegeben hat.

Nicht optimal, aber sollte ein improvment sein:

getNewsFeed(){ 
    this.homeService.getNewsFeed() 
    .subscribe(res => { 
     this.news_block = res; 
     setTimeout(() => checkElement(); 
    }, 

    error=>this.news_feed_error=true, 
    ()=> this.news_feed_error=false 
); 
} 

checkElement(){ 
    console.log(document.getElementsByClassName("overlayWrapper")); 

} 

diese Weise ist es zumindest ist hat die HTML sichergestellt tatsächlich empfangen worden ist, wenn getElementsByClassName() genannt wird.