angular viewchild and viewchildren

you use viewchild when you want to select a single element and viewchildren for referencing multiple element. There element are normally mounted on a template.

content here!

<div>

<div #div> 11111</div>

<div #div> 222222</div>

<div #div> 333333</div>

<button (click)="run()" >Execute</button>

</div>

Using Viewchild return single element

@ViewChild("div") divs: QueryList<any>;

Using ViewChildren return multiple element

@ViewChildren("div") divs: QueryList<any>;

Doing a bit of console logging on ngAfterViewInit.

ngAfterViewInit() {

console.log(this.divs);

}