Yes, Angular is launching version 14, which is standard in its ecosystem since it launches a new version every six months with enhancements, upgrades, and new capabilities to develop more powerful apps.
This shouldn’t affect other Angular projects. Remember “Angular” It doesn’t matter what version you’re using, the main thing is that you use Angular. Every year you receive a new version of Ubuntu, update your mobile phone, or every eight months NodeJS publishes a new version.
Typed Angular Forms
This feature is my personal favorite. For me, one of the best things about Angular is the forms, since it is that of daily use.
What is the most common way to capture data from our users? Forms are and it can become simple as well as really complex and Angular’s forms API is just wonderful.
But what’s new in this version? The novelty is that now the forms will have support for typing, how so? Let’s remember that the fact of handling typing in our case with TypeScript already reduced the 15% of the appearance of bugs in our systems, and we didn’t have really typed forms in Angular, until now.
Now in this new version, the Angular Forms API can infer the type you set and alert you that for example that field you defined as a number you can not modify it to a string or boolean or change it to an array because that would have inappropriate behaviors in your code that can produce bugs.
New primitives in the Angular CDK
Angular has its own UI package if you want to use it in your applications and these packages are the Angular Material and the Angular CDK which give you tools to not recreate the wheel.
What if you want to make a Modal or Dialog? Sure you can create it from scratch, but Angular already gives you this in a package where with the best practices including accessibility gives you the tools to create such components.
At the same time, this new version includes improvements to the Angular CDK with new components that are agnostic to the visual style you want to implement.
Streamlined page title accessibility
When creating applications with a framework and bringing it to millions of users, one of the most important things is to think about all types of users. That implies a new challenge, which is to make our solutions accessible to anyone.
Angular is constantly releasing new features so that by default when developing in Angular we already have those best practices and this version includes a way to work the titles of the pages from the definition of routes.
It works as follows:
const routes: Routes = [{ path: 'home', component: HomeComponent title: 'My App - Home' // <-- Page title }, { path: 'about', component: AboutComponent, title: 'My App - About Me' // <-- Page title }];
Standalone Components
This is one of the most important and the one that the community has been talking about the most. It is about developing applications without the need for modules.
One of the goals of Angular is to minimize the learning curve of new people learning this framework and modules is one of those things that is hard to understand at the beginning. So now Angular releases a way in which we can develop without modules.
Imagine the following, you have a component and normally every Angular artifact: services, pipes, directives and components must belong to a module. Well, not anymore, each component can be independent, import the context it needs and that’s it.
Something like this:
However, Angular clarifies that it releases this first version of the Standalone Components, but it is a preliminary version and may change in the future.
If this feature is going to maintain that architecture from the start, but reduce that learning curve, it seems like a good vision of the team going forward.
In addition, Angular is backward compatible, that is, this new way is optional, if you want to continue working with modules it will continue to be done or even have hybrids of modules and Standalone Components, even so it is too early to draw conclusions and we will see how this issue goes.
Extended developer diagnostics
This is one of the features that you only have to enjoy when upgrading and nothing else. Angular by working heavily with typing can use advantages of the IDE that others can’t and have a great experience when developing.
Part of that is the plugin for VSCode called Angular Language service that when installed is like having pair-programming that is constantly checking and telling you where you might be making a mistake.