c# - ng-grid 的水平滚动 - 2.0.11

Question

我的应用程序中有一个 ng-grid。网格的高度和宽度指定为 auto。我可以选择将列动态添加到网格中。当列数较少时没有问题。但是，如果列数较多，那么我的列的大小会缩小，而不是水平滚动条，并且所有列都以肮脏的方式出现在我的网格中。网格的宽度不会改变，所有列都会缩小以适应网格。我缺少获得水平滚动条的东西。

编辑: 以上是我原来的问题。现在我可以获得水平滚动条。但只有某些列可见。当我向右滚动时，我得到空网格。最后几个 coulmns 没有绑定(bind)到 ng-grid。仅绑定(bind)适合 ng-grid 而无需滚动的列。请任何解决方案!

注意: 我正在使用 ng-grid 2.0.11。版本有这个bug吗？

https://github.com/angular-ui/ng-grid/issues/2071

Answer 1

如果你想添加水平滚动条以防添加额外的列，请添加如下的columnDefs:

  $scope.gridOptions = {
    data: 'myData',

    columnDefs: [{ field: "<fieldname>", width: 120},
                { field: "<fieldname>", width: 120 },
                { field: "<fieldname>", width: 120 },
                { field: "<fieldname>", width: 120 }]
  };

如果(总列数*列宽)大于在 css 部分中声明的 ng-grid 表的宽度，这将为您提供水平滚动条。

AngularJS 默认使用 ng-grid 的 .gridStyle 类。

引用:ng-grid

您还可以在列固定示例中查看:columnDefs example with pinning

如果没有columnDefs，那么列将尝试自动适应现有的表格宽度，因此列会缩小。