AngularJs: использование $ scope.grid.api.setRowData () ag-grid не работает - PullRequest
Новая
       43

AngularJs: использование $ scope.grid.api.setRowData () ag-grid не работает

0 голосов
/ 07 апреля 2020

Итак, я разогнал это простое демо Ag-grid Plunker , а разветвленная версия - здесь .

Единственное изменение состоит в том, что старый код статически назначил строковые данные для ag-grid, в то время как мой форк пытается назначить меня динамически, используя API. я старый: 

var rowData = [
    {make: "Toyota", model: "Celica", price: 35000},
    {make: "Ford", model: "Mondeo", price: 32000},
    {make: "Porsche", model: "Boxter", price: 72000}
];

// let the grid know which columns and what data to use
var gridOptions = {
    columnDefs: columnDefs,
    rowData: rowData,
    onGridReady: function () {
        gridOptions.api.sizeColumnsToFit();
    }
};

новый: 

  var rowData = [
    {
      make: "Toyota",
      model: "Celica",
      price: 35000
    },
    {
      make: "Ford",
      model: "Mondeo",
      price: 32000
    },
    {
      make: "Porsche",
      model: "Boxter",
      price: 72000
    }
  ];

  $scope.grid = {
    columnDefs: columnDefs,
    rowData: [],
    rowSelection: 'single'
  };

$scope.grid.api.setRowData(rowData);

И в моем Plunker, и при попытке этого на localhost, ag-grid не появляется.

Что я делаю неправильно?

[Обновить] Я хочу получать данные с сервера каждый раз, когда пользователь нажимает кнопку, а не только когда сетка готова, и назначать rowData сетки, используя ее api.

[Upperdate] Я только что заметил на локальном хосте, что, хотя $scope.gridOptions определено, $scope.gridOptions.api не определено

Ответы [ 2 ]

1 голос
/ 07 апреля 2020

Область $ не будет иметь данных grid.api сразу после установки. Вы должны установить данные в функции onGridReady $ scope.grid, как показано ниже. https://plnkr.co/edit/qgPae2iGIl1A9i8O?preview 

$scope.grid = {
  columnDefs: columnDefs,
  rowData: [],
  rowSelection: 'single',
  onGridReady: function() {
    $scope.grid.api.setRowData(rowData);
  }
};
0 голосов
/ 08 апреля 2020

хорошо, я решил это. Это разница между статистической сеткой c и динамической c. См. этот Plunker .

Измените HTML на <div id="myGrid" class="ag-fresh" style="height: 100px;"></div> (удаляя ag-grid="grid"), а затем в контроллере: 

var currentCandidatesGridDiv = document.querySelector('#myGrid');
new agGrid.Grid(currentCandidatesGridDiv, $scope.grid);

$scope.grid.api.setRowData(rowData);

I просил, чтобы это помогло на предыдущий вопрос , и немного помогло себе - просто надеюсь, что я тоже помог кому-то еще: -)

...