angularjs - ui-grid columndefs

Usando las constantes de ui-grid para deshabilitar las barras de desplazamiento

Question

Con la última versión de ui-grid (v3.0.0-rc.16) es posible desactivar la barra de desplazamiento horizontal y vertical por separado. Conseguí este trabajo intercambiando

$scope.gridOptions.enableScrollbars = false;

con

$scope.gridOptions.enableHorizontalScrollbar = 0;
$scope.gridOptions.enableVerticalScrollbar = 0;

En las fuentes de ui-grid hay tres Constantes definidas para las barras de desplazamiento:

scrollbars: {
  NEVER: 0,
  ALWAYS: 1,
  WHEN_NEEDED: 2
}

Ante el hecho de que ui-grid es todavía inestable y se cambia muy a menudo, me sentiría más cómodo usando esas constantes en lugar de los valores específicos. Pero, ¿cómo puedo acceder a ellos?

Plunker: http://plnkr.co/edit/h0ewAZK616rKCH3T62te

Answer 1

Con el estilo de John Papa:

ExampleController.$inject = [''$scope'', ''uiGridConstants''];
function ExampleController($scope, uiGridConstants) {
    var vm = this;

    vm.gridOptions = {
        enableHorizontalScrollbar : uiGridConstants.scrollbars.NEVER,
        enableVerticalScrollbar   : uiGridConstants.scrollbars.NEVER
    };
}

Answer 2

Tengo mi respuesta en github:

Todo lo que tenía que hacer era pasar uiGridConstants a mi controlador de esta manera:

angular.module(''myApp'').controller(''myCtrl'',function($scope,uiGridConstants) {
    ...

    $scope.gridOptions.enableHorizontalScrollbar = uiGridConstants.scrollbars.NEVER;

    ...
})

Answer 3

Una solución alternativa para esto (dado que WHEN_NEEDED está actualmente deshabilitado) es configurar enableHorizontalScrollbar: 0 en sus gridOptions y luego en su hoja de estilo tiene lo siguiente:

.ui-grid .ui-grid-render-container-body .ui-grid-viewport {
  overflow-x: auto !important;
}

Ahora la barra de desplazamiento horizontal solo se muestra cuando es necesario.