【问题标题】:ag-Grid set filter and sort model without triggering eventag-Grid 设置过滤和排序模型而不触发事件
【发布时间】:2019-03-12 15:00:44
【问题描述】:

我正在通过 api 更新排序和过滤模型:

this.gridApi.setFilterModel(filterModels);
this.gridApi.setSortModel(sortModels);

问题是我有一个服务器请求绑定到排序和过滤器的更改,所以当用户更改时,数据会更新。这意味着当我更改代码模型(例如恢复状态或重置过滤器)时,它会导致多个请求。

有没有办法在不触发事件的情况下更新过滤/排序模型?

我看到有一个 ColumnEventType 参数,但看不到它是如何工作的。我可以指定一些我可以在我的事件处理程序中查找的变量来让它们忽略不是从用户生成的调用吗?

我正在尝试管理 URL 状态,因此当 url 查询参数更改时,我的代码会在网格中设置模型,但这最终会导致页面重新加载多次,因为在设置模型时会调用 onFilter 和 onSort 事件我无法想象可以防止这种情况发生。

【问题讨论】:

    标签: ag-grid


    【解决方案1】:

    当时,您将不得不自己管理它,即,就在您调用 setModel 之前,以某种方式在您的应用程序的共享部分(可能是全局变量)中标记它

    然后当你对这些事件做出反应时,检查它的状态,猜测它来自哪里。

    请注意,目前,我们已经为列事件添加了源,但它们还没有用于模型事件,我们计划添加它们,但我们没有 ETA

    希望对你有帮助

    【讨论】:

    • 谢谢。我尝试设置一个标志,但事件似乎在我的调用堆栈中的代码之后触发,因此它无效。现在我已经解决了多个请求的发生,但是如果您可以在事件中添加一个可传递的参数,或者在事件触发时添加某种回调/承诺,那将非常有帮助,谢谢。
    • 如果您想添加一个 plunker,我们会尝试看看我们是否可以提供帮助
    • @AlbertoGutierrez 自写这篇文章以来的 2 年里,这种情况发生了变化吗?
    【解决方案2】:

    我必须解决类似的问题。我找到了适合我这种情况的解决方案。也许这对某人有帮助。

    for (let j = 0; j < orders.length; j++) {
        const sortModelEntry = orders[j];
        if (typeof sortModelEntry.property === 'string') {
        const column: Column = this.gridColumnApi.getColumn(sortModelEntry.property);
        if (column && ! column.getColDef().suppressSorting) {
           column.setSort(sortModelEntry.direction.toLowerCase());
           column.setSortedAt(j);
         }
    }
    this.gridApi.refreshHeader();
    

    orders 是键值对象数组,key 是列名,value 是排序指令 (asc/desc)。

    设置过滤器不刷新很复杂

    for (let j = 0; j < filters.length; j++) {
       const filterModelEntry = filters[j];
       if (typeof filterModelEntry.property === 'string') {
          const column: Column = this.gridColumnApi.getColumn(filterModelEntry.property);
          if (column && ! column.getColDef().suppressFilter) {
             const filter: any = this.gridApi.getFilterApi(filterModelEntry.property);
             filter['filter'] = filterModelEntry.command;
             filter['defaultFilter'] = filterModelEntry.command;
             filter['eTypeSelector'].value = filterModelEntry.command;
             filter['filterValue'] = filterModelEntry.value;
             filter['filterText'] = filterModelEntry.value;
             filter['eFilterTextField'].value = filterModelEntry.value;
             column.setFilterActive(true);
          }
       }
    }
    

    过滤器中的属性:

    • 属性 - 列名
    • 命令 - 过滤操作(包含、等于、...)
    • value - 过滤器中使用的值

    【讨论】:

      【解决方案3】:

      对于在 2020 年 11 月寻找解决此问题的其他人来说,利用 onFilterModified() 可能会有所帮助。这在 onFilterChanged() 之前被调用,因此在这里设置一个值(例如 hasUserManuallyChangedTheFilters = false 等)并在过滤器更改事件中检查相同的值是一种可能的解决方法。虽然,我还没有发现任何与 onSortChanged() 事件类似的东西,它在排序应用于网格之前被调用。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2019-12-29
        • 1970-01-01
        • 2021-01-14
        • 2020-04-08
        • 2020-04-06
        • 1970-01-01
        • 2020-04-06
        • 2023-02-06
        相关资源
        最近更新 更多