I’ve got exciting news! Standalone components, directives, and pipes are closer than ever! The following link contains all the details on the RFC page:

One example from the RFC page

It’s time to be prepared for the future. If you haven’t already, it’s a good idea to use the AngularInlineModule

We encountered two unexpected situations recently because we didn’t trim input values.

First, Angular’s email validator performs the validation without trimming the value. In some cases, users accidentally add whitespace to the email when copying and pasting, which causes the validation to fail. …

We have a date picker component in our application. We send an event each time a user changes the date to our analytics provider. We have one use of it so far, so the analytics code was inside the component that uses it:

However, now we have more places…

In most cases, a feature flag is used when creating a new version of an existing page rather than adding multiple conditions to our code. When this is the case, we usually prefer to use the same URL for both versions.

Let’s examine how Angular Router can be used to…

Creating a new project using the Angular CLI generates by default environment files with one boolean property named production.

Many developers take it for granted, but using a boolean in this case isn’t the best choice. In real life, we have multiple environments. …

In our application, we have created a multi-select component. In most cases, we use the default design and functionality. There is a particular case where we need to show key-value options in our multi-select component, and we use it in multiple places across the application:

By default, Angular uses the emulated encapsulation strategy to make the component styles encapsulated. This means that if we want to override a component style from our parent, we need to use the ::ng-deep selector. For example:

The above works, but I’m not a big fan of this approach.

Angular v12.1.0 introduces a new experimental option to make subsequent builds faster by leveraging the Webpack’s filesystem cache feature and use it for the generated modules and chunks.

To enable it, we can set the NG_PERSISTENT_BUILD_CACHE=1 environment variable before running the ng serve or ng build commands:

After running…

In this article, we’ll learn how we can type the context object when creating custom structural directives. Let’s create a structural directive that provides the same functionality as the async pipe. It’ll get an observable, subscribes to it, and expose the next value via context:

We’ve created a structural…

Netanel Basal

I'm a Frontend Tech Lead at Lumigo, blogger, open source maintainer, creator of Akita and Spectator, Husband, and Father.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store