title: Cannot read property 'api' of undefined angular while using nggride
body: <pre><code>import { Component, OnInit, ViewChild } from '@angular/core';
  import { HttpClient } from '@angular/common/http';
  import { AgGridAngular } from 'ag-grid-angular';
  
  @Component({
    selector: 'app-sub1',
    templateUrl: './sub1.component.html',
    styleUrls: ['./sub1.component.css']
  })
  
  export class Sub1Component implements OnInit {
    @ViewChild('agGrid',{static: false} ) agGride:AgGridAngular
  
    columnDefs = [
      {headerName:'make',field: 
  'make',sortable:true,filter:true,checkboxSelection:true },
      {headerName:'model',field: 'model',sortable:true,filter:true  },
      {headerName:'price',field: 'price',sortable:true,filter:true }
    ];
  
    constructor(private http:HttpClient){}
  
    rowData :any;
  
    ngOnInit(){
      this.rowData=this.http.get('https://raw.githubusercontent.com/ag-grid/ag-grid/master/grid-packages/ag-grid-docs/src/sample-data/smallRowData.json')
    }
  
    getRow(){
      const selectedNodes = this.agGride.api.getSelectedNodes();
      const selectedData = selectedNodes.map( node =&gt; node.data );
      const selectedDataStringPresentation = 
        selectedData.map(node =&gt; node.make + ' ' + node.model).join(', ');
      console.log(`Selected nodes: ${selectedDataStringPresentation}`);
    }
  }
  </code></pre>