使用ui-grid常量禁用滚动条

Question

在最新版本的ui-grid (v3.0.0-rc.16)中，可以分别关闭水平和垂直滚动条。我通过交换让它工作起来

$scope.gridOptions.enableScrollbars = false;

使用

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

在ui-grid的源代码中，为滚动条定义了三个常量：

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

面对ui-grid仍然不稳定并且经常变化的事实，我会觉得使用这些常量而不是特定值会更舒服。但是，我如何访问它们呢？

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

Answer 1

我在github上得到了答案：

我需要做的就是将uiGridConstants传递给我的控制器，如下所示：

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

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

    ...
})

Answer 2

约翰·帕帕的风格：

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

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

Answer 3

解决此问题的一种方法(因为WHEN_NEEDED当前已禁用)是在gridOptions上设置enableHorizontalScrollbar: 0，然后在样式表中设置以下内容：

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

现在，水平滚动条仅在需要时显示。