Question

我正在使用Expandable UI Grid。

我的数据显示在网格中，在点击时展开，网格每5秒刷新一次。

如果我展开一行，那么当网格刷新时，它会每5秒折叠一次。

如何在网格刷新时保持行扩展？

代码

$scope.fillProductList = function () {
  $http({
    method: 'GET',
    url: getJobs,
    data: {}
  }).success(function (result) {

    $scope.showSubListGrid = false;
    $scope.myData = '';
    var gridDataWithDownload = result;

    //grid data
    $scope.myData = gridDataWithDownload;

    $scope.gridOptionsCategory.data = gridDataWithDownload;

    //   $scope.refresh = false;
    timer = $timeout(function () {
      $scope.fillProductList();
    }, timeOutStamp);

  }).error(function (result) {

    timer = $timeout(function () {
      $scope.fillProductList();
    }, timeOutStamp);

  });
};

$scope.gridOptionsCategory = {
  useExternalPagination: true,
  expandableRowHeight: 300,

  enableSorting: true,
  data: $scope.myData,

  enableColumnResizing: true,
  enableGridMenu: false,
  expandableRowTemplate: 'griddata.html',

  onRegisterApi: function (gridApi) {
    $scope.gridApi = gridApi;

    //  gridApi.expandable.toggleRowExpansion($scope.gridApi.grid.row[0].entity);
    gridApi.expandable.on.rowExpandedStateChanged($scope, function (row) {

      $scope.gridApi.grid.modifyRows($scope.gridOptionsCategory.data);
      $scope.gridApi.selection.selectRow($scope.gridOptionsCategory
        .data[0]);
      //$scope.gridOptionsCategory.expandableRowHeight = 500;
      //$timeout.cancel(timer);                     
      if (row.isExpanded) {

        row.entity.components = JSON.parse(row.entity.components)
        this.scope.gridOptionsCategory.expandableRowScope = row.entity;
        // $scope.GridOptions.expandableRowScope = row.entity.components;

      }
      if (!row.isExpanded) {
        timer = $timeout(function () {
          $scope.fillProductList();
        }, timeOutStamp);

      }
    });

  },
  enableHorizontalScrollbar: 0,
  //enableVerticalScrollbar:0,

  //useExternalSorting: true,
  columnDefs: [{
      field: 'filtertoggle',
      displayName: '',
      visible: true,
      headerCellTemplate: '' +
        '<button id=\'toggleFiltering\' style= "padding:3px 7px;" ng-click="grid.appScope.toggleFiltering()" class="btn btn-warning glyphicon glyphicon-filter">' +
        '</button>'
    },
    {
      name: 'Job Name',
      field: 'name',

      width: '20%',
      enableCellEdit: false,
      enableHiding: true,
      enableGrouping: false,

      //    enableFiltering: true,
      filter: {
        term: $scope.filterOptions.filterText
      }
    },
    {
      name: 'Profile',
      field: 'profile',
      width: '15%',
      enableCellEdit: false,
      enableHiding: true,
      enableGrouping: false
    }, {
      name: 'Progress',
      field: 'progress',
      enableSorting: true,
      width: '18%',
      enableCellEdit: false,
      enableHiding: true,
      enableGrouping: false,
      //    enableFiltering: true,                      
      cellTemplate: statusTemplate
    }
  ]
};

Answer 1

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

您可以查看这些代码吗？你可能会有所了解。

使用可扩展的Angular js ui网格

1 个答案: