title: How to make Angular ui grid expand all rows initially?
body: <p>I am using ui grid to show a list of data and I am trying to initially expand all rows.</p>
  
  <p>I am trying to do this in the onRegisterApi event:</p>
  
  <pre><code>scope.GridOptions =
          {
              data: properties,
              columnDefs: 
              [
                  { name: "Full Address", field: "FullAddress" },
                  { name: "Suburb", field: "Suburb" },
                  { name: "Property Type", field: "PropertyType" },
                  { name: "Price", field: "Price", cellFilter: 'currency'},
                  { name: "Status", field: "Status" },
                  { name: "Sale Type", field: "SaleType" }, 
                  { name: "Date Created", field: "CreateDate", cellFilter: "date:'dd/MM/yyyy HH:mma'"}
              ],
              expandableRowTemplate: 'template.html',
              expandableRowHeight: 200,
              onRegisterApi: (gridApi) =&gt; 
              {
                  scope.gridApi = gridApi;
                  gridApi.expandable.on.rowExpandedStateChanged(scope,(row) =&gt;
                  {
                      if (row.isExpanded) {
                          this.scope.GridOptions.expandableRowScope = row.entity;
                      }
                  });
                  gridApi.expandable.expandAllRows();
  
              }
          };
  </code></pre>
  
  <p>But the code above does not work. It looks like when I call expandAllRows() the rows are not rendered yet.</p>