I am using igx data grid to display data. My data is coming from API. I need to display grid in ascending order by default.
Please provide me sample how to achieve the same. ASAP.
I'm glad to hear that. Thank you very much!
Sorry was not able reply earlier. This worked!! Thanks a lot for your quick assistance.
Hello Shobhana Suara,
I'm not certain whether or not I correctly understand your scenario, but you might want to generate columns array dynamically when the data comes and to sort the data by IgxGridComponent's sort method in the code while, on the view side, you might want to set false to 'autoGenerate' and create igx-columns by *ngFor.
// app.component.ts // Assuming DATA comes from a server in a certain timing. this.data = DATA; // Generate columns array from the data. Object.keys(this.data[0]).forEach((key, index) => { this.columns.push({ field: key, header: key, sortable: true }); }); // Sort the data by Country in ascending order. // https://es.infragistics.com/products/ignite-ui-angular/docs/typescript/latest/classes/igxgridcomponent.html#sort this.grid.sort({ fieldName: 'Country', dir: SortingDirection.Asc, ignoreCase: true });
<!-- app.component.html --> <igx-grid #grid1 [data]="data" [autoGenerate]="false" [width]="'100%'" [height]="'400px'"> <igx-column #col *ngFor="let c of columns" [field]="c.field" [header]="c.header" [sortable]='c.sortable'> </igx-column> </igx-grid>
Could you give it a try?