【问题标题】:ng-grid is not displaying all columns on initial loadng-grid 在初始加载时未显示所有列
【发布时间】:2017-09-16 18:24:37
【问题描述】:

在我的应用程序中,我使用的是 ng-grid,我需要显示 12 列和大量数据。但是 ng-grid 并没有在初始加载时显示所有列。如果我通过调整大小对列进行任何细微更改,则会显示数据。有什么方法可以显示初始加载本身的数据..

网格定义

 <div ui-grid="gridOptions"
                             ui-grid-selection
                             ui-grid-resize-columns
                             ui-grid-move-columns></div>

网格数据绑定

                        $http.post('/api/search')
                        .success(function (data) {
                            $scope.gridOptions.data = data.Items;

                            if (data.Items.length == 0) {
                                $timeout(function () { notificationService.error("not found"}, 50);
                            }
                            else if (data.Items.length != 1) {
                                $alert.InlineWide('#' + $scope.modalId);
                            } else {
                                broadcast(data.Items[0]);
                            }
                            $(window).resize();                                
                        }).error(function (msg) {
                            notificationService.formattedError(msg);
                        });

示例 Grid 列定义:

                   $scope.gridOptions = {
                    columnDefs: [
                        {
                            field: 'Number',
                            displayName: 'number',
                            minWidth: 50,
                            sort: { direction: 'asc', priority: 0 }
                        },..],
                    onRegisterApi: function (gridApi) {
                        gridApi.selection.on.rowSelectionChanged($scope, afterSelectionChange);
                    },
                    enableRowSelection: true,
                    enableRowHeaderSelection: false,
                    multiSelect: false,
                    enableColumnResize: true,
                    enableColumnMenus: false,
                    plugins: [new ngGridFlexibleHeightPlugin()]
                };

【问题讨论】:

  • 能否提供与问题相关的代码?
  • 我添加了使用的示例代码.. @Gaurav
  • 您使用的是哪个版本的 ng-grid?
  • * ui-grid - v3.2.9 - 2016-09-21

标签: css angularjs angular-ui-grid ui-grid


【解决方案1】:

我已通过设置网格的宽度、高度和 fill-remainder-min-height 解决了这个问题

<div ui-grid="gridOptions"
                             style="width:855px; height:300px"
                             ui-grid-selection
                             ui-grid-resize-columns
                             ui-grid-move-columns
                             fill-remainder-min-height="300"></div>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2016-11-02
    • 1970-01-01
    • 1970-01-01
    • 2023-02-03
    • 2020-12-04
    相关资源
    最近更新 更多