2015-06-17 19 views
7

Sto usando la griglia ui per mostrare un elenco di dati e sto cercando di espandere inizialmente tutte le righe.Come rendere la griglia ui Angolare inizialmente tutte le righe?

io sto cercando di fare questo in caso onRegisterApi:

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) => 
      { 
       scope.gridApi = gridApi; 
       gridApi.expandable.on.rowExpandedStateChanged(scope,(row) => 
       { 
        if (row.isExpanded) { 
         this.scope.GridOptions.expandableRowScope = row.entity; 
        } 
       }); 
       gridApi.expandable.expandAllRows(); 

      } 
     }; 

Ma il codice di cui sopra non funziona. Sembra che quando chiamo expandAllRows() le righe non siano ancora visualizzate.

+0

BTW: Io uso dattiloscritto ma ha poca differenza con javascript. –

risposta

1

trovo posso espandere tutte le righe utilizzando evento rowsRendered:

gridApi.core.on.rowsRendered(scope,() => { 
     if (!gridApi.grid.expandable.expandedAll && !initialized) 
     { 
      gridApi.expandable.expandAllRows(); 
      initialized = true; 
     } 
}); 

ho usato una variabile inizializzata per identificare se questa è la prima volta che le righe sono resi come voglio solo per espandere tutte le righe inizialmente.

+1

Potresti fornire un esempio funzionante della tua soluzione? O sto facendo qualcosa di sbagliato passando da TypeScript a JavaScript o questo non funziona per me usando la v3.0.0. Grazie! – Kabb5

-1

Suppongo che si utilizzi una griglia, nel qual caso è possibile utilizzare l'opzione groupsCollapedByDefault: false per espandere tutti gli elementi per impostazione predefinita.

+1

Trovo che non ci sia questa opzione nella griglia utente. –

+0

puoi fare riferimento a una documentazione? – Asqan

14

Nel mio caso, i seguenti lavorato:

$scope.gridOptions = { 
     ... 
     onRegisterApi: function(gridApi) { 
     $scope.gridApi = gridApi; 
     $scope.gridApi.grid.registerDataChangeCallback(function() { 
      $scope.gridApi.treeBase.expandAllRows(); 
     }); 
     } 
    }; 
+0

Funziona per me! –

0

Nessuno dei precedenti ha lavorato per me per tutti i miei casi di utilizzo della rete.

 $scope.gridApi.grid.registerDataChangeCallback(function() { 
      if($scope.gridApi.grid.treeBase.tree instanceof Array){ 
       $scope.gridApi.treeBase.expandAllRows(); 
      } 

     }); 

le seguenti opere in tutti i casi che ho testato. DataChangeCallback viene chiamato due volte (per qualche motivo sconosciuto) sul caricamento iniziale della pagina. La prima volta, gridApi.grid.treeBase.tree è un oggetto che causa il problema con gridApi.grid.treeBase.tree.forEach sopra:

0

Nessuna di queste risposte ha lavorato per me, il seguente fatto:

scope.gridApi.core.on.rowsRendered(null,() => { 
    scope.gridApi.treeBase.expandAllRows(); 
});