javascript - 如果找不到数据,ag-grid 将所有内容隐藏在列标题下方

标签 javascript html angular ag-grid

当我将给定高度的 ag-grid 与 Angular 一起使用时,在显示任何数据之前,将显示数据的空间(实际上是网格)在文本“加载”中可见。在我的情况下这是不正确的,因为我没有将 rowData 绑定(bind)到 Observable 或 Promise,所以它不是异步的。单击按钮后将填充网格。我只想看到列标题,下面什么也没有。我的网格配置如下所示:

<ag-grid-angular
style="width: 100%; height: 335px;"
class="ag-theme-balham"
[gridOptions]="gridOptions"
[columnDefs]="columnDefs"
[rowData]="rowData"
animateRows
rowSelection="multiple"
>

所以我想隐藏除列标题之外的整个网格,直到 rowData 为空数组。有办法做到这一点吗?

最佳答案

澄清一下,我将 ag-grid 与 React 结合使用,但两者之间有很多相似之处。您可以在这里做两件事:

  1. 您可以控制在加载时或在没有数据时显示哪些文本
    [overlayLoadingTemplate]="<span></span>"
    [overlayNoRowsTemplate]="<span></span>"
  1. 由于您当前在网格的内嵌样式中设置了固定高度,因此它始终为 335 像素。一旦将其设置为非静态的东西,您就可以将此 Prop 添加到网格中,它会根据内部数据更改网格的高度。
[domLayout]="autoHeight"

关于javascript - 如果找不到数据,ag-grid 将所有内容隐藏在列标题下方,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54187702/

相关文章:

javascript - 2个链接ID之间的CSS线

jquery - 如何在时钟界面上获取用户输入

javascript - Angular2 $http promise 与 Promise.all()

javascript - 错误 : Cannot find a differ supporting object '[object Object]' of type 'object' . NgFor 只支持绑定(bind)到 Iterables

node.js - 为什么 chrome 审核中的 Node 与 lighthouse 这么慢?

javascript - 使用按钮 jquery 弯曲文本

来自外部文件的 Javascript 未加载

javascript - Access_token 在本地主机中工作,而不在服务器中工作

html - 使用自定义 CSS 登录页面

javascript - 如何让Facebook直播视频嵌入16 :9?