Category Archives: Angular

Change Detection in Angular

Change Detection is the backbone of the Angular framework, and each component has its own change detector. This article explains change detection strategies and optimizations to help you write highly performant Angular applications. Angular can detect when data changes in the component, and can re-render the view to display the updated data. Angular makes sureContinueContinue reading “Change Detection in Angular”

How to use conditions in Angular Template using

There are various ways you can apply conditions on Angular Template. Usually, you apply conditions to show a particular value or render a specific element based on a condition. In this post, let us see, the simplest way of achieving the conditions in Angular Template using the <ng-container> and <ng-template>.  To start with consider data,ContinueContinue reading “How to use conditions in Angular Template using”

Why use exportAs Property in Angular

Have you used exportAs property of a directive? It could be instrumental in working with public methods of a directive. Let us say; you have created a custom directive to change the background colour of the host element on the mouse hover as below, import { Directive, Input, HostListener, ElementRef } from ‘@angular/core’; @Directive({ selector:ContinueContinue reading “Why use exportAs Property in Angular”

When to use viewProviders in Angular – Simplified

I have often seen developers are confused about viewProviders property of the @Componnet decorator.  This post explains to you about the viewProviders option. The viewProviders defines the set of injectable objects that are visible to its view, DOM children. They are not visible to the content children. At the component level, you can provide a service in two ways: Using the providers arrayUsing the viewProviders array. IfContinueContinue reading “When to use viewProviders in Angular – Simplified”

How to use useClass with Tree Shakable Services in Angular

Recently, I was asked that how can we use providers such as useClass inside a Tree Shakable service?   By default, Angular services are tree shakable, which means if the application does not use them, they are not part of the final bundle. So, if you create a service using CLI as, ng g s LogContinueContinue reading “How to use useClass with Tree Shakable Services in Angular”

Do Angular useExisting providers create a new object of service?

Short answer is NO, the useExisting provider use object created by other tokens. Read on, To learn more about such concepts, join a free webinar on Saturday, 20 June 4 PM IST. RSVP here: https://www.meetup.com/Geek97/events/271292371/ In Angular, providers determine how an object of a particular token gets created. That means whether Angular creates a newContinueContinue reading “Do Angular useExisting providers create a new object of service?”

How to use Interceptor in Angular

Interceptors are used to intercepts HTTP requests and responses from the application. You can handle them or transform them before passing it on. For example, you can use an interceptor to add authorization token before passing the HTTP request or cache the HTTP response. Some of the usages of interceptors are as follows, Caching ofContinueContinue reading “How to use Interceptor in Angular”

Simplest way to share data between two unrelated Components in Angular

In Angular, it is essential to know how components communicate with each other. If you use a component inside another component, they create a parent child relationship.  In such a scenario, parent and child components communicate to each other in following ways: @Input() @Output() Temp Ref Variable ViewChild and ContentChild You can learn in detailContinueContinue reading “Simplest way to share data between two unrelated Components in Angular”