Question

我实现了角度ui-grid，看起来像： Angular ui-grid

但在某些情况下，它变得像： Shrinked grid

我需要解决方案，以便网格宽度保持不变，就像在第一张图片中一样。当我点击F12然后导航到网格到其他页面然后回来时，它通常会收缩。

我的网格选项是：

$scope.gridOptions = {
                    enableRowSelection : true,
                    enableRowHeaderSelection : false,
                    multiSelect : false,
                    enableColumnMenus : false,
                    columnDefs : [ {
                        "field" : "title",
                        "displayName" : "Title",
                        "visible" : true,
                        "enableHiding" : false,
                    }, {
                        "field" : "description",
                        "displayName" : "Description",
                        "visible" : true,
                        "enableHiding" : false
                    }, {
                        "field" : "dueDate",
                        "displayName" : "Due Date (mm/dd/yyyy)",
                        "cellFilter" : "date:'MM-dd-yyyy HH:mm a'",
                        "visible" : true,
                        "enableHiding" : false
                    }, {
                        "field" : "status",
                        "displayName" : "Status",
                        "visible" : false,
                        "enableHiding" : false
                    }, ]
                };

HTML:

            <div class="col-lg-12 col-md-12 col-sm-12">
                <div class="panel panel-default">
                    <div ui-grid="gridOptions" ui-grid-selection class="grid height-250"></div>
                </div>
            </div>

由于

Answer 1

通过查看angular ui grid的文档：http://ui-grid.info/docs/#/tutorial/101_intro，我可以提出以下建议：

您的css是否定义为：

.grid { 宽度：500px; 身高：250px; }
您在$scope.gridOptions.data中是否有正确格式的数据？你是否使用例如：float来覆盖网格css。如果没有样品吸管，很难说。
您是否包含了网格css。

我在GridUI的文档中看到了示例plunker：http://plnkr.co/edit/?p=preview我尝试了几件事，但它始终显示正确的宽度。所以很可能是你的外部css打破了布局。

检查它何时断开并查找正在应用于收缩列的css，然后将其与工作列进行比较。这是我能给出的最佳建议。

ANGULAR-JS：Angular UI-GRID宽度变化

1 个答案: