我正在使用:https://github.com/angular-ui/ui-grid.info/tree/gh-pages/release/3.0.0-RC.18
<div ui-grid="gridOptions" style="height:765px"></div>
当我对值进行硬编码时，如上所示，网格展开并且一切都按预期工作。
但是，如果我执行以下操作...
$scope.gridStyle = 'height:'+numRows*rowHeight+'px' //(765px);
<div ui-grid="gridOptions" style="{{gridStyle}}"></div>
高度打印在 div 中，并且 div 变宽，但内容本身仅加宽到 340px 左右。剩下的空间是空白的，所以我只看到 8 行而不是 25 行。我必须向下滚动，而网格中有 400 像素的空闲空间。 ui-grid-viewport 和 ui-grid-canvas 都没有使用这个空间......
为什么 ui-grid-viewport 不能使用该空间？
最佳答案
我用 ui-grid - v3.0.0-rc.20因为一个 scrolling issue is fixed当你走到容器的全高时。使用 ui.grid.autoResize模块将动态自动调整网格大小以适应您的数据。要计算网格的高度，请使用以下函数。 ui-if在渲染之前等待数据设置是可选的。
angular.module('app',['ui.grid','ui.grid.autoResize']).controller('AppController', ['uiGridConstants', function(uiGridConstants) {
...
$scope.gridData = {
rowHeight: 30, // set row height, this is default size
...
};
...
$scope.getTableHeight = function() {
var rowHeight = 30; // your row height
var headerHeight = 30; // your header height
return {
height: ($scope.gridData.data.length * rowHeight + headerHeight) + "px"
};
};
...<div ui-if="gridData.data.length>0" id="grid1" ui-grid="gridData" class="grid" ui-grid-auto-resize ng-style="getTableHeight()"></div>关于angularjs - Angular ui-grid 动态计算网格的高度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27837335/