Angular v21 features
I am a full-stack developer with 9+ years of experience, passionate about the JavaScript ecosystem. I have a bachelor's degree in computer science. I am most skilled and passionate about Angular and React. I am able to provide meaningful contributions to the design, installation, testing, and maintenance of any type of software system. I like to challenge myself in new roles. I have built and successfully delivered applications in multiple domains. In my free time, I like to write blogs related to software development. I have the pleasure of working on exciting projects across industries. The applications that I developed were scalable, deployable, and maintainable. I have a vision of providing cutting-edge web solutions and services to enterprises. Developed zero-to-one products.
The Angular team now offers three different ways to help you in using and developing components:
Use Angular Aria for accessible, headless components that you are able to style yourself however you want
Use the CDK for behavior primitives such as Drag and Drop that you can include in your own, custom-built components.
Use Angular Material for a full library of readily styled, opinionated components following Material Design principles. You can customize the components by using your own theming.
CLDR library support has been updated from v41 to v47, improving currency formatting, date formatting, etc.
We now support regular expressions in templates:
@let isValidNumber = /\d+/.test(someValue);
@if (!isValidNumber) {
<p>{{someValue}} is not a valid number!</p>
}
- Angular now has a built-in Signals formatter. Enable custom formatters (Chrome, Firefox) to use this feature.
Press enter or click to view image in full size
- You can now customize the IntersectionObserver options for @defer triggers related to on viewport, for example:
@defer (on viewport({trigger, rootMargin: '100px'}) {
<section>Content</section>
}
SimpleChanges are now generic allowing for better type checking of the values inside SimpleChanges, solving a highly-upvoted issue
As an alternative to CSS variables, you can now use a new set of utility classes to apply Material Design’s system tokens directly in your templates. See the theming guide for details!
CDK overlays now use browsers built-in popovers, helping to solve some accessibility issues
And in case you missed it — these are only the updates since Angular v20.2. If you only tune in every major release you might have missed:
New APIs to Animate elements as they enter and leave the DOM
CDK Drag&Drop improvement to allow copying items between lists
Route visualization and signal graph in Angular DevTools
and so much more — see our Summer Update blog post for details
