JAVASCRIPT

@viewchild in angular :use for take any refrerence of element

//html code:
<h2>Choose Brand Colors:</h2>
<color-sample
  [color]="primary"
  #primaryColorSample
  (click)="open()">
</color-sample>
  ... the rest of the AppComponent template
  //ts file:
  
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent implements  AfterViewInit {
   ....
   
  @ViewChild('primaryColorSample', {read: ElementRef})
  sample: ElementRef;

  ngAfterViewInit() {
    console.log('Values on ngAfterViewInit():');
    console.log("sample:", this.sample.nativeElement);
  }

  ....
}