[Angular] Difference between Ngafterviewinit and Ngaftercontentinit

Content is passed as children. View is the template of the current component.

The view is initialized before the content and is ngAfterViewInit() therefore called before ngAfterContentInit() .

@Component ({selector:'parent-cmp', Template:'<div #wrapper ><ng-content></ng-content></div>'})classparentcomponent {@ViewChild ('wrapper') Wrapper:elementref; @ContentChild ('mycontent') Content:elementref; Ngafterviewinit () {Console.log ('Ngafterviewinit-wrapper', This. Wrapper); Console.log ('ngafterviewinit-content', This. Content); } ngaftercontentinit () {Console.log ('Ngaftercontentinit-wrapper', This. Wrapper); Console.log ('ngaftercontentinit-content', This. Content); }}

< parent-cmp ><  #myContent>foo</div></parent-cmp  >

If You run this code, the output for ngAfterViewInit - content should is null .

So if you want to the component's props, you cannot does it in ' ngafterviewinit ' and you need to do it in ' Ngafter Contentinit '.

[Angular] difference between ngafterviewinit and ngaftercontentinit