What's New: Ignite UI for Angular 24.1

Radoslav Mirchev / Thursday, August 8, 2024

It’s release time and with the latest updates to Ignite UI for Angular in the last couple of months, we introduced an extensive set of new features and enhancements designed to streamline and improve the app-building experience for web developers.

This continuous update spans from major enhancements to the way users visualize data to performance optimizations, new components, and a lot more. But what are the key highlights? Let’s explore them all.

Version 17.1

Improved package tree-shaking

Tree-shaking is crucial for Angular component libraries because it helps optimize the final bundle size by removing unused code. By eliminating unused code, tree-shaking reduces the amount of JavaScript that needs to be downloaded and executed by the browser. This leads to faster load times and a better user experience. Here are some of the benefits from enhanced package tree-shaking:

Improved Performance
Efficient Resource Utilization
Simplified Codebase
Enhanced Security

New: Icon Button

The Ignite UI for Angular Icon Button directive is intended to turn any icon into a fully functional button. The igxIconButton comes in three types - flat, outlined, and contained which is the default one.

Version 17.2

Calendar updates – styling and theming

Ignite UI calendar look, and feel has been updated to improve the UX and addressing customer feedback. The Ignite UI for Angular Calendar component, developed as a native Angular component, provides an easy and intuitive ways to display date information, enable dates or apply Angular calendar disable dates mode. Users can choose from three different selection modes - single selection, multi selection or range selection.

Button improvements

Support for external icon sets

Now part or all icons used by Ignite UI for Angular components can be replaced with non-Material icon set. The Ignite UI Icon Service makes it easy for developers to include custom SVG images and use them with IgxIconComponent. In addition, it could be used to associate a custom class to be applied on IgxIconComponent according to given font-family.

Updates of date, datetime and time editor formats

Version 18.0

Support of Angular 18

Header template for the Pivot Grid

As of version 18.0.0 the Ignite UI for Angular row dimension value headers can be enabled through pivotUI option.

Expose headers for row dimensions to be visible in excel when exporting a pivot grid

Deprecate of ‘displayDensity’ property

Version 18.1

Horizontal row dimension expansion for Pivot Grid

Headers focus and keyboard navigation for Pivot Grid Row Dimension Headers

Example of Header template and Horizontal row dimension expansion for the Pivot Grid:

Example for Angular Pivot Grid Component

Grid Toolbar updates

Example for Angular Grid Toolbar Component

Complete CHANGELOGS:

To Wrap It All Up...

Seamlessly crafted for compatibility, Ignite UI for Angular is the library that enables you to leverage the power of the latest technologies and major releases. Committed to providing you with the best Angular UI toolkit and related insights, our goal is to equip you with more know-how, new features, enhanced performance, and improved stability. Some of the enhancements were added thanks to the requests from users like yourself through our Ignite UI for Angular GitHub repository. With this in mind, we are always open to suggestions and feedback – it makes us grow and better respond to your development needs.

If you need more details, we encourage you to check out our:

In Addition

Follow Ignite UI for Angular on Medium to stay up to date and learn about the latest Angular-related projects we are working on. Give us a star on GitHub and help us continue improving our product by addressing any concerns, questions, or feature requests in the issues section.