Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

When does Angular2 ngAfterViewInit get called?

I need some jQuery code to run after my Angular component view has initialized to transform number values into stars.

I put the code in the ngAfterViewInit function, but it is not doing what I need it to. I set a break point in the function and I see that most of the HTML of my component has not even loaded by the time ngAfterViewInit function is called. The parts that have not loaded are generated using *ngFor directive.

How can I get my code to run after this directive has generated all of the html on which I need to operate?

like image 713
Gabe O'Leary Avatar asked Feb 24 '16 23:02

Gabe O'Leary


People also ask

Is ngAfterViewInit called after ngOnInit?

ngOnInit() is called right after the directive's data-bound properties have been checked for the first time, and before any of its children have been checked. It is invoked only once when the directive is instantiated. ngAfterViewInit() is called after a component's view, and its children's views, are created.

Why ngAfterViewInit is not called?

ngAfterViewInit() is called once after ngAfterContentChecked(). ngAfterViewInit() is called after all child components are initialized and checked. ngAfterViewInit() is called after the view is initially rendered. This is why @ViewChild() depends on it.

When should we use ngAfterViewInit?

ngAfterViewInit is useful when you want to call a lifecycle hook after all child components have been initialized and checked.

What is called after ngAfterViewInit?

ngAfterViewChecked() It is called after the ngAfterViewInit hook and every subsequent ngAfterContentChecked hook.


1 Answers

I have been using ngAfterViewChecked when I depend on the DOM being ready.

import {Component, AfterViewChecked} from '@angular/core';   export class Spreadsheet implements AfterViewChecked{     ngAfterViewChecked(){     } } 
like image 50
TGH Avatar answered Sep 22 '22 16:09

TGH