NG-电网自动/动态高度 [英] ng-grid Auto / Dynamic Height

问题描述

我如何NG-电网自动调整基于其高度的页面大小？在NG-网格的网站上的文档使用一个固定的高度。我见过的最好的解决方案来自该链接：

How do I get ng-grid to auto resize its height based on the page size? The documentation on ng-grid's site uses a fixed height. The best solution I've seen comes from this link:

.ngViewport.ng-scope {
    height: auto !important;
    overflow-y: hidden;
}

.ngTopPanel.ng-scope, .ngHeaderContainer {
    width: auto !important;
}

这不会与服务器端分页工作。我从NG-网格站点复制服务器端分页的例子，并应用上面的CSS，但你可以看到，只有第6行显示：<一href=\"http://plnkr.co/edit/d9t5JvebRjUxZoHNqD7K?p=$p$pview\">http://plnkr.co/edit/d9t5JvebRjUxZoHNqD7K?p=$p$pview

This does not work with server-side paging. I've copied the server-side paging example from ng-grid's site, and applied the css above, but as you can see, only the first 6 rows are shown: http://plnkr.co/edit/d9t5JvebRjUxZoHNqD7K?p=preview

和{身高：100％}无法正常工作......

And { height: 100% } does not work...

推荐答案

您可以尝试使用NG-电网的灵活的高度插件，所有你需要做的就是这个插件在网格选项添加到插件财产，他会照顾的其余部分。

You can try using the ng-grid Flexible Height Plugin, all you need to do is add this plugin to the plugins property in grid options and he'll take care of the rest .

示例：

$scope.gridOptions = {
    data: 'myData',
    enablePaging: true,
    showFooter: true,
    totalServerItems: 'totalServerItems',
    pagingOptions: $scope.pagingOptions,
    filterOptions: $scope.filterOptions,
    plugins: [new ngGridFlexibleHeightPlugin()]
};

活生生的例子： http://plnkr.co/edit/zNHhsEVqmpQmFWrJV1KQ?p= preVIEW

这篇关于NG-电网自动/动态高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！