调整ng-grid中的页脚列大小

时间:2014-05-05 12:12:51

标签: css angularjs ng-grid

我对AngularJS和ng-grid有一个小问题。

我想在页脚中添加一行,其中包含每列的总值。使用页脚模板,我设法做到这一点,到目前为止一切顺利。

有什么办法可以根据网格列的大小调整这些列的大小?或者至少将行宽设置为遵循网格画布的宽度?

提前致谢。

1 个答案:

答案 0 :(得分:0)

使用CoulmnDefs并在页脚模板中使用相同的宽度。

    $scope.gridOptions = {
    data: 'myData',
    enablePaging: true,
    showFooter: true,
    footerRowHeight:'30px',
    footerTemplate: '<div style="width: 20%; display: inline-block;">{{total1}}</div><div style="width: 60%; display: inline-block;">{{total2}}</div><div style="display: inline-block;">{{total3}}</div>',
    totalServerItems: 'totalServerItems',
    columnDefs: [{
      field: 'name',
      width: '20%'
    }, {
      field: 'allowance',
      width: '60%'
    }, {
      field: 'paid'
    }],
    pagingOptions: $scope.pagingOptions,
    filterOptions: $scope.filterOptions
    };

这是基于旧的Plunker我找到了somwhere。

如果网格变小,这仍然是疯狂的。尝试在style.css或columnDefs和footer模板中的列中设置网格的最小宽度。