DEV Community

Cover image for Angular 15 Updates: What's new?
Stefan Omerovic
Stefan Omerovic

Posted on

Angular 15 Updates: What's new?

Just recently, Angular came out with the version 15, and this version has some amazing things built in.

If you wish to check the video format of this post, click here.

I would advise to watch the video, as it is more detailed.

Standalone Components

In the Angular 14, we got one cool feature called Standalone Components. This feature was not related only to the components, but to the directives, and pipes.

In the Angular 15, and now improved API, Standalone Components are stable.

This means that we can develop full applications with those, and not use NgModules, if we don't want to.

Because this is the case, Angular has added additional ways to use their modules, like HTTP, or Routing module.

HTTP Module

Routing Module

Directive Composition API

The Directive Composition API is a new feature added into the Angular framework.

With this, from now on we can add host directive property to our components, and pass directives into it, instead into our HTML code.

This will keep things more smooth, and private, but still keep the same, if not enhanced functionality.

Host Directives

Image Directive

Another stable feature that will work with Standalone Components and NgModules.

To use it, simply replace src attribute to ngSrc on your images.

Image Directive

This will add default lazy loading, it will optimize your images, and improve load times.

Another cool thing that came with this Image Directive is Fill Mode. From now on, we don't need to use explicit width and height on the images, we can simply use Fill Mode.

Fill Mode

Additional Updates

There were additional updates as well, and here are some of those:

  • Additional ESBUILD Support
  • New Features in Development
  • SVG Templates (IN DEVELOPMENT)
  • File Replacement Support (IN DEVELOPMENT)
  • Additional Quick Fixes
  • Generate Standalone Components
  • More Minor Updates

Debugging Improvements

There are some improvements in the debugging department as well. So from now on, we should get much better error messages.

Error Message

Angular Material Updates

Additional updates were made to Angular Material as well... Here are those:

  • MDC
  • Accessibility Improvements
  • Identical API Paths
  • Guide to Update to Angular Material 15
  • Update Module by Module
  • Range Selector Support
  • Customizing Density
  • CDK Listbox
  • And More

Conclusion

With all these updates that Angular has, it is worth updating our apps to it.

Once again, to watch the video format of this post, which has more details, click here.

Top comments (0)