Ag-grid：在侧边栏面板外部以角度单击时隐藏列侧边栏

Posted 2023-03-28

【中文标题】Ag-grid：在侧边栏面板外部以角度单击时隐藏列侧边栏

【英文标题】：Ag-grid : hide column sidebar when clicked outside of side bar panel in angular

【发布时间】：2021-11-06 20:59:40

【问题描述】：

有谁知道在 ag-grid 侧边栏外部单击时如何隐藏它？我可以在按钮单击时做到这一点，但在侧边栏外部单击时无法找到如何折叠它

【问题讨论】：

请提供足够的代码，以便其他人更好地理解或重现问题。

【参考方案1】：

你需要设置为false

this.gridApi.setSideBarVisible(false)  // hide
this.gridApi.setSideBarVisible(true)    // show

您可以使用以下方式处理事件：-

https://www.ag-grid.com/react-data-grid/grid-events/#reference-selection

检查可用的网格事件，如 onCellClicked、onCellFocused 等：-

https://www.ag-grid.com/react-data-grid/side-bar/#side-bar-api

还有：-

componentDidMount() 
  window.addEventListener('keydown', this.onKeyDown);


  onKeyDown = (e) =>       
      // check sidebar is visible
   
     if(this.gridApi.isSideBarVisible())
    // code here
     
  

【讨论】：

没用。实际上设置此列侧边栏后并没有打开

在外部单击时，您只需调用网格事件并将其设置为 false this.gridApi.setSideBarVisible(false)。更新了答案。

它适用于单元格事件。谢谢，但是有什么方法可以跟踪工具面板外的点击吗？因为如果我在网格外点击它就不起作用

只需使用 addEventListener 检查侧边栏是否可见并关闭。如果有帮助，请接受它作为答案。

谢谢你。