Блог

Я боролся более 1 дня, пытаясь найти решение для предварительного заполнения выпадающего списка angular-ui-grid данными из серверной части. И да, я видел много похожих вопросов, но ни в одном из них не говорится о заполнении selectOption реальными данными из серверной части.

Это отлично работает с предопределенным массивом, подобным этому: $scope.tiposArquivoSelecionados = [{ value: 1, label: 'First'}, { value: 2, label: 'Second'}, { value: 3, label: 'Third'}];

Но когда я пытаюсь заполнить selectOption данными, собранными из серверной части, selectOption не отображается. Взгляните:

Данные собраны успешно, сетка успешно визуализирована, что заставляет меня думать, что это проблема времени.

Вот список из нескольких обходных путей, которые я пробовал (все неудачно), чтобы решить возможную проблему с синхронизацией:

• обновите сетку после сбора данных;
• поместите ссылки на столбцы внутри обратного вызова службы для успешного выполнения
• поместите ng-if в .html для отображения сетки, только если array.length > 0

Ни один из них не сработал =/

Объявление массива selectOptions:

 $scope.tiposArquivoGridSelectOptions = [];
  

Код из gridOptions.columnDefs:

 {
  field: 'controleArquivoId',
  name: 'Tipo de Arquivo',
  cellClass: 'ui-grid-cell-padding',
  enableFiltering: true,
  enableSorting: true,
  enableHiding: true,
  filter: {
    type: uiGridConstants.filter.SELECT,
    selectOptions: $scope.tiposArquivoGridSelectOptions,
  },
  sort: {
    direction: uiGridConstants.ASC,
    priority: 3
  }
},
  

В моем контроллере у меня есть метод init (), который вызывает службу для сбора данных из серверной части и заполняет массив selectOption.

 AutorizacoesReenvioService.listarTiposArquivoPorAno(moment().year()).then(
  function (success) {
    var responseData = success.data;

    responseData.forEach(function(item) {
      $scope.tiposArquivoGridSelectOptions.push(
        {
          value: item.id,
          label: item.nomeArquivo
        }
      );
    });

    $scope.gridApi.core.refresh();
  },
  function (error) {
    console.error(success.data);
  }
);