How to Lazy and Dynamically Load a Component in Angular

There are three ways you can use a component in an Angular app. Loading on route change Using as a child component Dynamically loading on demand However, this article focuses on loading a component dynamically and lazily. The main advantage of lazily loading a component is reducing the initial bundle size and only downloading theContinueContinue reading “How to Lazy and Dynamically Load a Component in Angular”

Required @Input properties in Angular

Angular 16 adds a new future of making an @Input() decorated property REQUIRED, which means that to use that component, the value of the required property has to be passed. @Input({required:true}) title? :string; To Understand it, let us assume that you have a component named ProductComponent with @Input() decorated properties as shown below, const templateContinueContinue reading “Required @Input properties in Angular”

Step-by-Step Understanding the Async Pipe

The async pipe can make a huge difference in your change detection strategy for your Angular app. If it’s been confusing to you so far, come work through this step-by-step explanation. We’ll understand it together! In Angular, the async pipe is a pipe that essentially does these three tasks: It subscribes to an observable or aContinueContinue reading “Step-by-Step Understanding the Async Pipe”