Question

我需要在角度js中使用ui-grid，我正在进行一些测试，以根据bootstrap类隐藏列。例如，考虑使用包含100列的表，但在移动设备上，您只想显示其中的3列。

这是一个掠夺者

http://plnkr.co/edit/9TGp1vPZeOfKLjzezgUv?p=preview

我正在使用：

cellClass:"hidden-sm",headerCellClass:"hidden-sm"

如您所见，列未显示但网格仍占用所有空间。

任何帮助？

Answer 1

ui grid似乎并不支持使用css进行大小调整。您必须使用自己的方法来设置可见性。

    function setColumnVisibility() {
        if (($(window).width()) <= 768) {
            $scope.gridOptions.columnDefs[1].visible = false;
            $scope.gridOptions.columnDefs[2].visible = false;
            $scope.gridOptions.columnDefs[4].visible = false;
        }

        if (($(window).width()) <= 992) {
            $scope.gridOptions.columnDefs[5].visible = false;
            $scope.gridOptions.columnDefs[7].visible = false;
        }
    }

    setColumnVisibility();

    $(window).resize(function() {
        setColumnVisibility();
    });

Answer 2

您可以使用列上的visible:false属性将其完全隐藏。

http://plnkr.co/edit/Cj4yvmEEnrcziKl6FdyX?p=preview

使用角度ui.grid隐藏带有引导程序的列

2 个答案: