Log in to like this post! Ignite UI for Angular 11.0.0 Release Radoslav Mirchev / Wednesday, November 11, 2020 Just in time for Angular 11, it’s Ignite UI 11.0.0! We are all excited about the release of Angular 11 and the new features that it supports. At Infragistics, we strive to provide you with the best possible user experience and keep you up-to-date with the latest versions of frameworks, platforms, and technology. That is why we are excited to share that we have released Ignite UI for Angular 11.0.0 , with full support for Angular 11, so quickly after its release! It has been less than a month since we released Ignite UI for Angular 10.2.0, but our team has been hard at work and once again we have new component features and enhancements ready for you! Angular 11 includes stricter types, router performance improvements and end of the support for some IE versions. So, we have taken advantage of the new performance improvements to ensure the best possible experience for you and your users. Now, let’s look at everything that is included in Ignite UI for Angular 11.0.0: Angular Grids: Grid, Tree Grid and Hierarchical Grid Grid Toolbar refactoring The toolbar is great at separating logic/interactions which affects the grid as a whole. Thus, it can be configured to provide default components for controlling, column hiding, column pinning, advanced filtering and exporting data from the grid. The way the toolbar is instantiated in the grid has changed. It is now a separate component projected in the grid tree and it can be templated and styled differently from it. Thus the `showToolbar` property is removed from all grids and all other properties related to the toolbar in the grid are deprecated. It is important to note that the API for the toolbar component was changed during the refactor and many of the old properties are now removed. Unfortunately, having an adequate migration for these changes is complicated to say the least, so any errors with template bindings should be handled at project level. You can find more in our Update Guide topic. <igx-grid [data]="data" [autoGenerate]="true"> <igx-grid-toolbar> <igx-grid-toolbar-title>Grid Title</igx-grid-toolbar-title> </igx-grid-toolbar> </igx-grid> New option for Grid Column Pinning and Column Hiding Another feature request coming from github, asking for more options in the UX behavior of the column pining and column hiding. Select all rows in a group It is feature requested coming from our customer, logged in our github repository. Now when Row Selection is enabled, a Group By row selector is rendered in the left-most area of the group row. In case the **rowSelection** property is set to single, checkboxes are disabled and only serve as an indication for the group where selection is placed. If the rowSelection property is set to multiple, clicking over the Group By row selector selects all records belonging to this group. Excel Style Filter templatable icon Now the Excel Style Filter is fully customizable as you can also re-template the Excel style filtering icon in the column header using the igxExcelStyleHeaderIcon directive. <igx-grid ...> <ng-template igxExcelStyleHeaderIcon> <igx-icon>filter_alt</igx-icon> </ng-template> </igx-grid> Angular Components: Calendar, Badge and Overlay Angular Calendar ARIA Angular calendar is now in compliance with WAI-ARIA guidelines for screen readers. A small badge option Updated animation of auto position strategy of the Overlay Here it is the complete Ignite UI for Angular Change Log for 11.0.0 General IgxGrid, IgxTreeGrid, IgxHierarchicalGrid Added a new directive for re-templating the Excel style filtering header icon - IgxExcelStyleHeaderIconDirective. Breaking Change - Changed the how the grid toolbar is instantiated in the grids. The toolbar is now templated rather than being activated through a property on the parent grid. The toolbar features are also exposed as templatable components and the old properties are deprecated. Refer to the official documentation for more information. FilteringStrategy Breaking Change - filter method exposed by the FilteringStrategy class now requires 3rd advancedExpressionsTree and 4th grid parameters. If not needed, just pass null. IgxCalendar Is now fully accessible to screen readers. IgxOverlay New functionality to automatically determine the correct animation that is needed when showing an overlay content. This is used with Auto Position strategy, where the IgxOverlay content is flipped, depending on the available space. New Features IgxCalendar Is now fully accessible to screen readers. Improvements IgxOverlay New functionality to automatically determine the correct animation that is needed when showing an overlay content. This is used with Auto Position strategy, where the `IgxOverlay` content is flipped, depending on the available space. As we move toward the end of 2020, we are ending on a positive note with lucky number 11! We want to take this opportunity to thank all of you, our customers, and partners, who continue to share your feedback and ideas and help us to make Ignite UI for Angular the best Angular toolkit. Follow us on Medium and stay up-to-date with the latest Angular-related projects that we are working on. Give us a star on GitHub and help us to continue to improve our product by addressing any concerns, questions or feature requests in the issues section. We will continue to do our best to constantly improve our product experience to meet all your needs and build apps with ease.