Q:

angular 6 : how to loop the server data into ag-Grid

i have question i'm new at angular 6 and i face a problem ag-Grid about i want to for loop the rows so i can display all the information that comes from API in the correct column order but the data looping and display the last row only . all i need away to for loop the data and display it in the row , i tried my way to display the data but it display the last row of given data . 
here some of my code :- 
MY CODES
/
thank you and Please help me 

A:

If you are getting the data from API i.e. it is an Observable instead of a hard-coded array, use the async pipe with rowData:
<ag-grid-angular 
    style="width: 500px; height: 500px;" 
    class="ag-theme-balham"
    [rowData]="rowData | async"
    [columnDefs]="columnDefs"
    rowSelection="multiple"
    >
</ag-grid-angular>

