Ignite UI for Angular - Recent Threads

Seemingly no igniteui-angular-charts 21 available

César Varona — Tue, 09 Dec 2025 10:30:41 GMT

Hi,

I have to upgrade an application using igniteui-angular charts to 21. It looks like IgniteUI Angular 21 is available, whereas the charts package is not. Is it truly like this? And if yes, any idea as to when will the charts for angular 21 be available?

Kind regards

RE: Seemingly no igniteui-angular-charts 21 available

César Varona — Mon, 09 Feb 2026 10:44:43 GMT

It looks like it's finally out, although it's astonishing that nobody at Ignite has taken the time to just post a short answer saying "Nope, still unavailable, it will still take some weeks"

How can I add a pinned header summary row on igx-grid (Angular)?

Anupam Rawat — Tue, 07 Oct 2025 06:28:49 GMT

I want to add a pinned header summary row that displays the aggregate values of all columns in a single row. This summary row should always stay pinned directly below the column headers — similar to a pinned row — and remain unaffected by actions like sorting, filtering, or data updates.

Additionally, it should:

Stay fixed right under the header when vertically scrolling the grid.
Be horizontally scrollable along with the rest of the grid content.
Automatically adjust its cell widths based on the corresponding column sizes.

Has anyone implemented something similar or found a clean workaround using igx-grid (Angular)?

For more information about pinned rows, please refer to the video below:

https://drive.google.com/file/d/1vRedbUN8U8rIP2Axzshc2iqfU3jZgCf7/view?usp=sharing

RE: How can I add a pinned header summary row on igx-grid (Angular)?

Federic Lindsey — Sat, 17 Jan 2026 08:45:18 GMT

Ever felt lost trying to summarize data in a table? I have! I once used a complex formula in Excel to get totals at the top of each column, but it was fragile. Is there a way to pin a summary row directly under the column headers and have it unaffected by sorting or filtering? It would save so much time! Makes me think even Freddy Fazbear's accounting could be made easier! Five Nights At Freddy's

Snackbar default width after upgrading from version 18

Mark P — Mon, 12 Jan 2026 16:25:17 GMT

Hi,

We have an app currently running Angular & Ignite UI version 18 and are looking to update to the latest version 20/21. On updating from version 18 to 19 we have observed a change to the default snackbar width.

I have created samples using version 18 & 19 based on the example at https://www.infragistics.com/products/ignite-ui-angular/angular/components/snackbar#angular-snackbar-example.

In 19 the snackbar is now full width. In version 18 snackbars were sized according to their content.

Is this an intentional change? Is it documented? Is there a way to size snackbars as per version 18 in the latest version 20/21?

Subject: Compatibility Issues with Angular 21 Migration (Ignite UI Core & Excel)

ravikiran reddy — Fri, 09 Jan 2026 04:06:08 GMT

We are in the process of migrating our application from Angular v20 to v21. While upgrading Angular CLI and Core to v21 worked without issues, we encountered compatibility problems when updating Angular CDK and Material to v21 alongside Ignite UI.
Specifically:
- @infragistics/igniteui-angular has a v21 release, but
- igniteui-angular-core and igniteui-angular-excel appear to remain at v20 versions.
- This mismatch is causing dependency conflicts and runtime errors when we attempt to align all packages with Angular 21

Could you please confirm:
- The planned release timeline for Ignite UI Core v21 and Ignite UI Excel v21.
- Whether there are recommended workarounds until these packages are updated (e.g., holding CDK/Material at v20).
- Any migration notes or guidance for teams moving to Angular 21 with Ignite UI.
We rely heavily on Ignite UI Core and Excel features, so clarity on the upgrade path will help us plan our migration effectively.

RE: Seemingly no igniteui-angular-charts 21 available

Mark P — Tue, 06 Jan 2026 08:55:43 GMT

I also have this question, would like to see a reply from someone at Infragistics here.

Properties are not working as expected for igx-data-annotation-slice-layer

Hendrik Freund — Fri, 19 Dec 2025 12:21:02 GMT

Hi,

i want to use the

igx-data-annotation-slice-layer

in a igx-data-chart what actually works but now I want to customize 
certain things a little bit but I fail.

this is the layer code

<igx-data-annotation-slice-layer
  [dataSource]="annotationSliceStockSplitData"
  [targetAxis]="mainXNumAxis"
  [brush]="'black'"
  opacity="0.5"
  annotationTextColor="transparent"
  annotationLabelMemberPath="label"
  annotationValueMemberPath="value"
  annotationBackground="transparent"
  annotationBorderColor="transparent"
  overlayTextMemberPath="label"
  overlayTextAngle="90"
  overlayTextStyle="bold 20pt Arial"
  overlayTextVerticalMargin="0"
  overlayTextHorizontalMargin="0"
  overlayTextLocation="OutsideTopRight">
</igx-data-annotation-slice-layer>

First of all, can I make the line straight and not dotted.
I know there exists igOverlays but they do not have annotations.
Also I struggle with the following properties:

overlayTextAngle="90"
overlayTextStyle="bold 20pt Arial"

I would assume the angle is applied to the dotted line vertically with 90
but the angle seems to be moving around that line.

I also want to style the text in size and font but this does not work either.
It remains all the time.

You can see the attached immage.
Hope you can help me.
Ty

RE: Properties are not working as expected for igx-data-annotation-slice-layer

Hendrik Freund — Mon, 05 Jan 2026 08:45:17 GMT

Ty that works

BR,

Hendrik

RE: Seemingly no igniteui-angular-charts 21 available

César Varona — Tue, 23 Dec 2025 05:46:45 GMT

No news about this? Really?

RE: Properties are not working as expected for igx-data-annotation-slice-layer

Divya Jain — Mon, 22 Dec 2025 18:41:02 GMT

Hello Hendrik,

Preview stage is that we released the feature and we are still actively working on it , improving it, and fixing the bugs on higher priorities. As i have informed that i already logged the bug for the feature not working , i will confirm once again when i hear any thing back from the development team.

For straight lines you just need to set dashArray to "Solid" like this:

<igx-data-annotation-slice-layer

name="SliceLayerStockSplit"

#sliceLayerStockSplit

[dataSource]="annotationSliceStockSplitData"

[targetAxis]="xAxisBottom"

brush="dodgerblue"

annotationTextColor="white"

annotationLabelMemberPath="label"

annotationValueMemberPath="value"

dashArray="Solid"

.....

RE: Properties are not working as expected for igx-data-annotation-slice-layer

Hendrik Freund — Mon, 22 Dec 2025 06:14:29 GMT

Thanks for the answer,

so leaving the preview stage will become a full featured slice layer?

What is the time schedule for this?

Is it possible to achieve this with the annotation part of the layer?

Can you give an example on how the dashed array works?

I could not find such a property in the docs for the igx slice layer

or is it in the datasource part?

BR,

Hendrik

RE: Properties are not working as expected for igx-data-annotation-slice-layer

Divya Jain — Fri, 19 Dec 2025 17:22:55 GMT

Hello,

Thank you for your post. You can use dashArray to "Solid" to have straight line instead of dotted line.

And you are right 'overlayTextAngle' and 'overlayTextStyle' properties are not working as expected , its due to annotation slice layer feature is in preview state, its possible that these properties are not supporting right now. But i have logged the bug to get those working.

Logged the bug with id 41595 ,Going to create a private case to linked with the bug.

Thank you, let me know if you have further question or concern.

IgxGrid Group by | Drag-and-Drop reordering of groups

Michael Dahm — Mon, 13 Oct 2025 10:54:51 GMT

Hello Infragistics Support,

When grouping is enabled in IgxGrid, users can drag & drop to reorder rows within a group, but they cannot drag & drop to reorder the groups themselves. We need end-users to be able to reorder entire groups by dragging the group header.

Steps to Reproduce

Configure an IgxGrid with grouping enabled (e.g., via groupingExpressions).
Enable row drag & drop (e.g., rowDraggable).
Group the grid by one or more columns.
Try to drag a group header to move the whole group up/down.

Actual Behavior

Row reordering inside a group works.
Group headers are not draggable; group order is effectively locked to the default key sort.
No public API/event exists to programmatically reorder groups in response to user actions.

Expected/Requested Behavior

Allow drag-and-drop of group headers to reorder entire groups.
When a group is moved, all its child rows move with it.
Preserve expanded/collapsed state of the moved groups.

If this is already possible via an API or configuration we missed, guidance would be appreciated. Otherwise, please consider this a feature request.

Here is a small demo project. Just "npm run start" it.

Thank you!
Michael Dahm

RE: IgxGrid Group by | Drag-and-Drop reordering of groups

Kathy Barrera — Mon, 15 Dec 2025 14:07:57 GMT

Hi Michael,

As far as I know, IgxGrid currently doesn’t support drag-and-drop reordering of group headers. Reordering is limited to rows within a group, and group order follows the grouping key/sort logic with no public API to change it dynamically.

So you’re not missing anything — this would indeed be a new feature request. Your description (moving the whole group, keeping rows and expand/collapse state) makes sense and is well scoped. Hopefully the team can consider it for a future release.

How can I improve performance when rendering large igGrid datasets in Ignite UI?

Inamullah Khan — Thu, 11 Dec 2025 10:27:25 GMT

To improve performance when rendering large igGrid datasets in Ignite UI, use row and column virtualization to render only visible rows and columns, and implement paging or lazy loading with remote data to avoid loading everything at once. Disable unnecessary features like grouping, summaries, or complex templates, keep cell templates lightweight, define columns explicitly with autoGenerateColumns: false, and use batch updates to prevent repeated re-rendering. These strategies reduce memory usage, minimize DOM operations, and significantly enhance grid performance for large datasets.

RE: IgxGrid Group by | Drag-and-Drop reordering of groups

Wilbur Bullock — Fri, 28 Nov 2025 09:34:56 GMT

Hi Michael,
Thanks for the detailed description and demo project. Currently, IgxGrid supports drag-and-drop for rows within a group, but there isn’t a built-in way to drag entire group headers to reorder groups. You are correct that no public API currently allows programmatic reordering of groups directly via user actions.
As a workaround, you could implement custom logic: listen for a drag event on the group header, and then update the groupingExpressions array to reorder the groups programmatically, preserving the child rows and expanded/collapsed states. This approach requires some manual handling of the grid’s state.
Otherwise, your suggestion would make a solid feature request for the Infragistics team to consider adding native support for group header drag-and-drop in future releases. Wheelie Life

RE: IgxGrid Group by | Drag-and-Drop reordering of groups

Wilbur Bullock — Fri, 28 Nov 2025 09:04:24 GMT

Schedule

Onder Ozcan — Wed, 26 Nov 2025 17:20:26 GMT

Hello,

“Is there an Outlook-like scheduler component in Angular similar to the one in WPF? I couldn’t find it in the demo.”

Best Regarts

RE: Schedule

Bozhidara Pachilova — Thu, 27 Nov 2025 09:42:23 GMT

Hi Onder,

The Ignite UI suite currently does not include a Scheduler component.This is a candidate for a feature request. You could log one in our GitHub repo here. This gives you the opportunity to communicate with the development and product management teams directly regarding your idea. Make sure to provide details on why this component would be valuable to your team and any additional context.

Thank you for your cooperation.

Best regards,
Bozhidara Pachilova
Infragistics

Cell Merging

Root Twilight — Mon, 03 Nov 2025 19:35:42 GMT

Hello,

When using the the Cell Merging feature, would it be possible to stop the split when clicking on a row(cell) ? I know it is a feature by design, but would it be possible to avoid that?

If not how else could I implement it ? Could you provide a little example.

My data is dynamic so I don't see how I could use Multi-Row-Layout.

My goal is to achieve smth like this: A read-only grid where filtering is possible with (Excel Filter)

For the first 3 rows, the first 5 column cells are merged and the state-icon, job...is only shown once.

We already implemented this with the material design table using row span, but unfortunately igx-grid does not offer that property.

I already asked in the Github repo discussion, but just to be 100% sure, I opened it here also.
github.com/.../16407

Thank you in advance [emoticon:c4563cd7d5574777a71c318021cbbcc8]

RE: How can I add a pinned header summary row on igx-grid (Angular)?

Debra Hugh — Fri, 31 Oct 2025 11:42:16 GMT

You can achieve a pinned header summary row in IgxGrid by using the built-in summaries feature and combining it with pinned rows.

Here’s the general approach:

Enable summaries on the columns you want:

<igx-column field="price" [hasSummary]="true"></igx-column>
Use a custom summary class if you want specific summary logic (like totals, averages, etc.):

import { IgxSummaryResult, IgxSummaryOperand } from 'igniteui-angular'; export class CustomSummary extends IgxSummaryOperand { operate(data: any[]): IgxSummaryResult[] { return [ { key: 'sum', label: 'Total', summaryResult: data.reduce((a, b) => a + b, 0) } ]; } }
Pin the summary row to the top by using the igxGrid.pinRow() method inside ngAfterViewInit() or a lifecycle event once the grid is rendered.

this.grid.pinRow('summaryRowId');
If you need a static header-style summary row (not scrollable with data), you can use a custom header template combined with summary values computed from your data — that gives you more layout control.

Example:

Angular 19 - while compiling facing issue with theming

Rajender Lekkala — Wed, 15 Oct 2025 16:23:11 GMT

Hi Team ,

After installing below packages in Angular19 application ,

"@infragistics/igniteui-angular": "^19.1.8",

"igniteui-theming": "^21.0.2",

We are getting below errors ,

src/igx-global-them.scss ,

Thanks,

Rajender Lekkala.

RE: Angular 19 - while compiling facing issue with theming

Riva Ivanova — Fri, 17 Oct 2025 08:01:09 GMT

Hello,

I am glad I was able to assist you with this matter and that everything is now working as expected.

Thank you for using Infragistics components.

Sincerely,
Riva Ivanova
Software Developer

RE: Angular 19 - while compiling facing issue with theming

Rajender Lekkala — Thu, 16 Oct 2025 12:40:58 GMT

@Reva Ivanova ,

Thanks for ur help, it's working now .