隐藏 ag-grid 状态栏

Hide ag-grid status bar

这个问题是关于企业版自带的ag-grid状态栏的问题。我目前正在使用 ag-grid-community 19.1 和 Angular 7.

我正在寻找抑制状态栏的最佳方法?当我根本不包括 statusBar 网格选项时,我仍然在我的网格底部看到空的 space(尽管它是空白的),而状态栏应该在该位置。检查生成的 HTML 揭示了这个的存在:

<!--AG-STATUS-BAR-->
<div class="ag-status-bar" ref="statusBar">
    <div ref="eStatusBarLeft" class="ag-status-bar-left"></div>
    <div ref="eStatusBarCenter" class="ag-status-bar-center"></div>
    <div ref="eStatusBarRight" class="ag-status-bar-right"></div>
</div>

现在,如果我在 Chrome 控制台中完全删除该部分,它就会根据需要消失。但是我试过通过 css 这样做,但它似乎不起作用:

.ag-status-bar {
    height: 0px;
}

老实说,我更喜欢通过 statusBar 网格选项中的设置以编程方式执行此操作的方法,但我在 ag-grid 文档中没有看到类似的内容。

感谢任何帮助;谢谢。

不设置 statusBar 网格选项应该足以让状态栏不出现。

因此,除了通过 css 执行以下操作外,我没有其他选择:

.ag-status-bar {
    display: none;
}

When I don't include the statusBar grid option at all I'm still seeing empty space at the bottom of my grid (although it is blank), where the status bar should be.

同意。当我不将它包含在 gridOptions 中时,它根本不应该出现。但无论如何,我会提供我认为对某人有帮助的任何内容。
顺便说一句,加价仍会存在于 DOM 中。因此, 提供的将是正确的解决方案,如果您在任何情况下都看不到它。


您可以通过访问 Accessing Status Bar Panel Instances

以编程方式更改其可见性
toggleStatusBarComp() {
   let statusBarComponent = this.gridApi.getStatusPanel("statusBarCompKey");
   let componentInstance = statusBarComponent;
   if (statusBarComponent.getFrameworkComponentInstance) {
     componentInstance = statusBarComponent.getFrameworkComponentInstance();
   }
   componentInstance.setVisible(!componentInstance.isVisible());
}

查看文档中的这个示例:Get Status Bar Panel Instance