gpt4 book ai didi

angular - ag-Grid - 如何在添加或修改数据后强制自定义排序

转载 作者:行者123 更新时间:2023-12-04 15:59:16 27 4
gpt4 key购买 nike

我试图在我的 Ionic 4/Angular 8 中对 ag-Grid 中的列使用自定义排序应用。
我有一个示例应用程序 here ,或在 Stackblitz我无法让它在 Stackblitz 上运行,但它肯定会在本地运行,
无论如何,有几件事需要注意的是我希望网格在虚拟模式下运行(例如可能有 1000 行数据),而且我已经设置了 this.gridOptions.immutableData = true;处理我来自 ng/rx 的数据.
另外我使用一个组件作为单元格模板,但我认为我们可以在这里忽略它(使用现有示例)
我希望对行进行排序,所以调用我的 dateComparator功能

  • 当我第一次加载数据时
  • 如果我添加或更新了任何数据

  • 为了模拟来自服务器的新数据,我有一个调用 add 的添加按钮。方法。
    我添加了一个 comparator在柱子上...
            public ngAfterViewInit(): void {                
    const self = this;
    this.gridOptions.immutableData = true;
    this.gridOptions.animateRows = true
    this.gridOptions.api.setColumnDefs([
    {
    headerName: 'myheader',
    comparator: self.dateComparator,
    sortable: true,
    field: 'equipment',
    cellStyle: { padding: 0 },
    cellRendererFramework: TemplateRendererComponent,
    cellRendererParams: {
    ngTemplate: this.itemCard
    },
    },
    ]);

    this.setData();
    }

    private dateComparator(valueA, valueB, nodeA, nodeB, isInverted): number {
    console.log('sorting');
    return 1;
    }
    但是,当我加载网格,或者调用上面的add方法时,我的 dateComparator没有被调用。仅当我单击列标题时才会调用它。
    我试过调用 this.gridOptions.api.redrawRows()但这不会导致它排序。我看不到任何其他明显的 sort调用的函数。
    我的问题是,如何在不单击列标题的情况下自动应用此排序(即,当我加载或更新数据时)?

    最佳答案

    要默认对列进行排序,您必须在 colDef 中指定排序属性 -

    sort: 'desc', // asc or desc

    您也可以在使用排序 api 初始化网格后执行此操作 -
    var sort = [
    {
    colId: 'country',
    sort: 'asc',
    },
    {
    colId: 'sport',
    sort: 'asc',
    },
    ];
    this.gridApi.setSortModel(sort); // provide sort model here

    现在,当您的数据更新并且您需要让网格知道以根据您的自定义比较器维护排序时,您需要调用 - onSortChanged()
    根据文档-

    onSortChanged()
    Gets the grid to act as if the sort was changed. Useful if you update some values and want to get the grid to reorder them according to the new values.



    应用排序模型的示例 here

    关于angular - ag-Grid - 如何在添加或修改数据后强制自定义排序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62113929/

    27 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com