【问题标题】:Ag-Grid column on second line of row if data exists如果数据存在,则行第二行的 Ag-Grid 列
【发布时间】:2018-05-12 14:31:46
【问题描述】:

我希望实现 ag-grid 的免费版本以显示大约 1,000 条记录。这些记录有大约 8 列将显示在第一行,但我希望第 9 列显示在第二行的整个行宽上。只有存在数据时才会显示。有没有办法用 Ag-Grid 实现这一点?

【问题讨论】:

    标签: styling multiline ag-grid


    【解决方案1】:

    在 AgGrid 的免费版本中,您拥有 Full Width Rows。但是,您不能同时拥有访问相同数据的全宽行和常规列行。我假设您正在寻找的是这样的设计:

    |___|___|___|___|___|
    |___________________|
    |___|___|___|___|___|
    |___________________|
    |___|___|___|___|___|
    |___________________|
    

    因此,为了同时拥有列和行,您需要复制数据并执行类似的操作

    function isFullWidth(index) {
      return index % 2 === 0;
    }
    

    现在,如果您希望全宽行可展开/可折叠(我假设第 9 列太小并且您想在该列中放置一个展开按钮是一些详细信息),您必须为行分组或行树获取 ag-grid 企业。

    我们的团队也遇到了这个问题(数据不适合列中),我们采用了将 ngx-bootstrap-tooltip 放入列中的方法,因此在悬停(或hammer.js-gesture)时,您会看到一个工具提示。

    【讨论】:

    • 您对设计的描述正是我想要的。作为一个业余程序员,我希望有一个更容易实现的解决方案,不涉及购买企业选项。是否有任何其他免费网格可以提供类似或更先进的实现?如果此解决方案易于实施,我提前道歉,但我的技能有限。
    • 您还可以查看 PrimeNG 的 Turbo Table。但我认为你最好的选择真的是做我提到的黑客或调整你的 UI 设计以最适合 ag-grid 的免费版本。 PrimeNG 开发人员无缘无故地关闭了问题,所以我不喜欢使用他们的框架。而且我认为在primeng中,您还需要做一个hack,以便在它们之间同时拥有可排序的列和行,但我不确定。
    • 谢谢菲尔。您是否有机会提供一个简单的示例代码段? JSON 源是sfuysa.com/suspJSON.php 问题出在 COMMENTS 列
    • 您好,企业版有没有办法做到这一点?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2020-12-11
    • 2020-02-20
    • 2019-03-10
    • 1970-01-01
    • 2012-07-16
    • 1970-01-01
    • 2018-08-29
    相关资源
    最近更新 更多