Angular Interview Questions
Browse through our curated collection of questions
What are Pure and Impure pipes in angular?
EasyPure pipes :
These pipes are pipes that use pure functions. As a result of this, a pure pipe doesn't use any internal state, and the output remains the same as long as the parameters passed stay the same. Angular calls the pipe only when it detects a change in the parameters being passed. A single instance of the pure pipe is used throughout all components.
Impure pipes:
For every change detection cycle in Angular, an impure pipe is called regardless of the change in the input fields. Multiple pipe instances are created for these pipes. Inputs passed to these pipes can be mutable.
By default, all pipes are pure. However, you can specify impure pipes using the pure property, as shown below.
@Pipe({ name: 'demopipe', pure : true/false })
Define the ng-content Directive.
EasyConventional HTML elements contain some content in between the tags. For example:
<p>Put your paragraph here</p>
Take this example of customized text between angular tags as an example:
<app-work>This won’t work like HTML until you use ng-content Directive</app-work>
However, doing so won't work as it did for HTML elements. To make it work as per our HTML example, we will need to use the ng-content directive. Additionally, it facilitates the creation of reusable components.
What Are Class Decorators in Angular?
EasyThe class decorator contains the metadata of the suitable class type. It appears just before the class definition and declares the class to be of a certain type. Some class decorators are:
@Component
@NgModule
@Pipe
@Directive
@Injectable
What is metadata? How Is Metadata Represented in Angular?
EasyMetadata is used to decorate a class so that it can configure the expected behavior of the class. The metadata is represented by decorators.
Metadata is represented using decorators like class decorators, property decorators, method decorators.
Examples of decorators in Angular
Class decorators: @Component and @NgModule
Property decorators: @Input and @Output
Method decorators: @HostListener
Parameter decorators: @Inject, Optional
What is the purpose of the async pipe?
EasyAsync pipe subscribes to a promise or an observable and returns the latest value. If a new value is emitted, the pipe marks the component that needs to be checked for any changes.
<code>observable|async</code>
What is zone in Angular?
EasyA Zone is an execution context that persists across async tasks. Angular relies on zone.js to run Angular’s change detection processes when native JavaScript operations raise events.
What is the difference between constructor and ngOnInit?
EasyTypeScript classes have a default method called a constructor, which is normally used for construction purposes. It has the same purpose as a standard class in Java, such as building an object and initializing it. The constructor is also used to inject the dependencies we need in the component.
On the other hand, the ngOnInit method is specific to Angular, especially used to define Angular bindings. The constructor is always called before ngOninit.
What Is Package.json? What’s the difference between package.json vs. package-lock.json?
EasyWith package.json file, it becomes easy to manage the project dependencies. We can mention details like the version, language, etc.… in package.json. For example, if bootstrap is used in our project, we can mention the ng-bootstrap package and its version in package.json.
Explain Authentication and Authorization.
EasyAuthentication: The user login credentials are passed to an authenticate API (on the server). On the server side validation of the credentials happens and a JSON Web Token (JWT) is returned. JWT is a JSON object that has some information or attributes about the current user. Once the JWT is given to the client, the client or the user will be identified with that JWT.
Authorization: After logging in successfully, the authenticated or genuine user does not have access to everything. The user is not authorized to access someone else’s data, he/she is authorized to access some data.
Differentiate between Observables and Promises.
EasyObservables are lazy, which means nothing happens until a subscription is made. Whereas Promises are eager; which means as soon as a promise is created, the execution takes place. Observable is a stream in which passing of zero or more events is possible and the callback is called for each event. Whereas, promise handles a single event.