Ignite UI for Angular: Roadmap Updates and Release Notes

Slav Karaslavov / Thursday, March 1, 2018

The Map to the future 

For the past 4 months, we at Infragistics have been working on providing the community with a new set of features promised at the beginning of November. There were many, important to the users, components, and functionalities included on our Roadmap that would allow them to use Ignite UI for Angular to create even richer applications. 

 Semantic Grid Row and Cell Objects 

We started the Roadmap execution with Row and Cell object implementation for our igx-grid. This was required due to our plan to include Virtualization in the grid. Virtualization, as a feature, is very important for users with big data sets that they want to display and scroll and navigate throughTo complete the task, we needed the Row objects to be abstracted and so we did. We did the same for the Cell objects. Working on those features was a prerequisite to starting the virtualization research. 

Her majesty Virtualization 

igxForOf virtualization directive! This is the core feature, which the team was working on for the past few monthsMany modern applications require displaying big data sets without sacrificing performance of the application. For such scenarios, it is imperative to have a virtual rendering mechanism in place that allows the user to scroll through a large set of data smoothly with optimal performance. The idea is to provide smooth rendering and scrolling experience by fixing the number of DOM objects in-memory.  

Our Virtual-For Directive can be incorporated in just about any component that needs to render large amounts of scrollable data. Last but not least, we've made sure that virtualization performs equally under all browsers that we support, including Edge and Internet Explorer 11. 

Alternative Row styles 

Timprove the user experience with the igxGrid we've implemented Alternating row styles, that allows the user to easily follow on which row the data he is reading belongs to.  

Ignite UI CLI 

Our team was also working on expanding the Ignite UI CLI with Ignite UI for Angular templates. We wanted Ignite UI CLI to provide Ignite UI for Angular templates, views, and components integration. All features of the CLI are accessible in the context of Ignite UI for Angular, as well as the full Ignite UI product suite. This gives users аn easy way to kickstart their projects fast with just a few commands in our command-line. You can also create custom Templates and use them as well to build your Angular, React or JQuery projects. 

Operations UI 

We, as a team, know how important filtering ifor grids. Our team was working in collaboration with the UX team to improve the basic filtering we provided with the 5.0.1 release. There were long discussions and research, which lead to having a more advanced filter UI, allowing users to easily find their data in the Grid. The specification can be found on our GitHub Wiki pages. We still have work to do on this feature and will be releasing more of it later in the year. Wwill be introducing not only simple and advanced filtering through the UI, but also excel-style filter for smaller data sets, sorting, and other data-related operations. The UI will be expanded further to include column manipulation operations. 

 

Theming – The UX specialist  

We've developed a new mechanism through SASS, which includes easy-to-use API, for changing the Theming on your components. Our UX team focused a lot of their time to provide the users an easy way to do this with only a few lines of code. Each component in our portfolio is easy to style according to the needs of the customer. You can restyle one or multiple components or change the styling of the entire suite. 

 

The Toggle Directive! 

The igxToggle directive allows the users to open, interact with and close a toggle container, and to apply animations to itigxToggle also allows users to implement toggle-based component/views (eg. dropdowns), while the igxToggleAction directive controls other "toggleable" components. All of our toggleable components implement the igxToggle or igxToggleAction internally, such as the dialog, grid operations UI, date picker, etc. 

 

Live-editable Samples with Stackblitz 

Easy to changes and easy to work with samples available on the website. We have made changing the code of our samples very easy and fast. Most of our components can be opened with Stackblitz and code can be changed on the spot as you see your changes in real time. Go to our product page and check it out. 

 General changes  

Renaming and restructuring directives and components based on the general Angular component and directive naming guidelinesTemplating the Tabbar tabs content is now possibleDocumentation is also getting a large update. Full internationalized support for DatePicker and CalendarWe have also done igx-List refactoring, igx-avatar, igx-tab-bar, igx-calender changes. For more details please visit our Change Log: https://github.com/IgniteUI/igniteui-angular/blob/master/CHANGELOG.md  

 What is coming next? 

…..igxTimePickerGrid Column and Row Pinning; Grid Export to Excel; Grid Multi-column Headers; Combo Box; Grid Grouping; Tabs and much more! 

 Are you excited? We are working on a daily basis to provide you with the best features out there!  

Click here for directions on how to install Ignite UI for Angular, then sign up for a free 30-day trial that includes set-up along with enterprise-ready support. Call one of our five worldwide offices to set up a product demo. We’re excited to hear what you think.