[!Note] Please note that this control has been deprecated and replaced with the Grid component, and as such, we recommend migrating to that control. This will not be receiving any new features, bug fixes will be deprioritized. For help or questions on migrating your codebase to the Data Grid, please contact support.

    Visão geral da classificação em grade do Web Components

    A Tabela de Dados/Grade de Dados Ignite UI for Web Components suporta classificação de colunas ascendentes e decrescentes com uma configuração de Classificação de Coluna Única, Várias Colunas e Colunas Tri-State.

    Web Components Grid Sorting Example

    Code Snippet

    Você pode classificar por uma única ou várias colunas crescentes ou decrescentes na grade de dados Web Components usando a headerClickAction propriedade. Se TriState estiver habilitado, você poderá remover a classificação aplicada a uma coluna.

    import { HeaderClickAction } from 'igniteui-webcomponents-grids';

    <igc-data-grid
    id="grid"
    height="100%"
    width="100%"
    header-click-action="SortByMultipleColumns">
</igc-data-grid>

    Sorting through API

    import { IgcColumnSortDescription } from 'igniteui-webcomponents-grids';
import { ListSortDirection } from 'igniteui-webcomponents-core';

let grid1 = (document.getElementById("grid") as IgcDataGridComponent);
grid1.dataSource = data;

let colSortDesc = new IgcColumnSortDescription();
colSortDesc.field = "UnitsInStock";
colSortDesc.sortDirection = ListSortDirection.Descending;
grid1.sortDescriptions.add(colSortDesc);

    API References