ag-grid angular get element ref

Question

How to get a DOM reference on the grid element in Angular? There doesn't appear to be a straightforward way. I tried:

markup:

<ag-grid-angular #logGrid></ag-grid-angular>

ts:

@ViewChild('logGrid') logGrid: AgGridNg2;

AgGridNg2 does not have a nativeElement or ElementRef property exposed.

I also tried:

@ViewChild('logGrid') logGrid: ElementRef;

It doesn't have nativeElement property because its type is AgGridNg2 not ElementRef.

I need the DOM reference because ag-grid doesn't expose scrollHeight of its contents.

Answer 1

You can get a reference to the host element of the component by setting the read property of the ViewChild decorator to ElementRef:

@ViewChild('logGrid', { read: ElementRef }) logGridElementRef: ElementRef;