Angular Interview Question Set 11

Categories: Angular

What is the purpose of AsyncPipe in Angular?

The AsyncPipe is used to subscribe to an observable or promise and return the latest value it has emitted. When a new value is emitted, the pipe marks the component that has been checked for changes.

Example:

@Component({  

  selector: 'async-observable-pipe',  

  template: `<div><code>observable|async</code>:  

       Time: {{ time | async }}</div>`  

})  

export class AsyncObservablePipeComponent {  

  time = new Observable(observer =>  

    setInterval(() => observer.next(new Date().toString()), 2000)  

  );  

}  



What do you understand by services in Angular?

In Angular, services are singleton objects that get instantiated only once during the lifetime of an application. An Angular service contains methods that are used to maintain the data throughout the life of an application. Angular services are used to organize as well as share business logic, models, or data and functions with various components of an Angular application.

Angular services offer some functions that can be invoked from an Angular component, such as a controller or directive.



What is the key difference between a constructor and ngOnInit?

Constructor is a default method in TypeScript classes that are normally used for the initialization purpose. On the other hand, the ngOnInit is specifically an Angular method and is used to define Angular bindings. Even though constructors are getting called first, it is always preferred to move all of your Angular bindings to the ngOnInit method.



What do you understand by observable and observer in Angular?

Observable: An observable is a unique object just like a promise that that is used to manage async code. Observables are not part of the JavaScript language so the developers have to rely on a popular Observable library called RxJS. The observables are created using the new keyword.

See a simple example of observable to understand it better:

import { Observable } from 'rxjs';  

const observable = new Observable(observer => {  

  setTimeout(() => {  

    observer.next('This is a message from Observable!');  

  }, 1000);  

});   



How do you categorize data binding types in Angular?

In Angular, we can categorize data binding types in three categories distinguished by the direction of data flow. These data binding categories are:

  1. From the source-to-view
  2. From view-to-source
  3. View-to-source-to-view


What is multicasting in Angular?

Multicasting or Multi-casting is the practice of broadcasting to a list of multiple subscribers in a single execution.

Let's take a simple example to demonstrate the multi-casting feature:

var source = Rx.Observable.from([1, 2, 3]);  

var subject = new Rx.Subject();  

var multicasted = source.multicast(subject);  

// These are, under the hood, `subject.subscribe({...})`:  

multicasted.subscribe({  

  next: (v) => console.log('observerA: ' + v)  

});  

multicasted.subscribe({  

  next: (v) => console.log('observerB: ' + v)  

});  



What do you understand by Angular Material?

Angular Material is a UI component library that is used by professionals to develop consistent, attractive, and completely functional websites, web pages, and web applications. It follows the modern principles of web designing, such as graceful degradation and browser probability, and is capable of doing a lot of fascinating things in website and application development.



What is lazy loading in Angular? Why is it used?

In Angular, the by default tendency of NgModules is eagerly loaded. It means that as soon as the app loads, all the NgModules are loaded, whether or not they are immediately necessary. That's why lazy loading is required. Lazy loading is mandatory for large apps with lots of routes. This design pattern makes the app load NgModules when they are only required. Lazy loading helps keep initial bundle sizes smaller, which in turn helps decrease load times.



What is the use of Angular filters? What are its distinct types?

Filters are an essential part of Angular that helps in formatting the expression value to show it to the users. We can easily add filters to services, directives, templates, or controllers. We can also create personalized filters as per requirements. These filters allow us to organize the data in such a way that only the data that meets the respective criteria are displayed. Filters are placed after the pipe symbol ( | ) while used in expressions.

A list of various types of filters used in Angular:

currency: It is used to convert numbers to the currency format.

filter: It is used to select a subset containing items from the given array.

date: It is used to convert a date into a necessary format.

lowercase: It is used to convert the given string into lowercase.



Top Blogs
Angular and Node JS difference Published at:- The top 5 new features of Angular did you know Published at:- Introduction to AngularJS Published at:- Single-Page Applications and Bootstrapping the Application in Angular JS Published at:- Dependency Injection and AngularJS Routes Published at:- AngularJS Templates, Views, Models, Controllers Published at:- Integrating AngularJS with Other Frameworks Published at:- Testing AngularJS Applications in the IDE Published at:- End-to-End Testing with Protractor Published at:- AngularJS Views and Bootstrap Published at:- Adding a New Blog Controller Published at:- Adding a New Blog Template In Angular JS Published at:- Ways to Communicate with REST Services Published at:- Services and Business Logic and Handling User Authentication in Angular JS Published at:- Using Basic Authentication, Creating AngularJS Services, Holding User Credentials in Angular JS Published at:- AngularJS Security : why we are covering security in a book on AngularJS Published at:- MEAN Cloud and Mobile, Local Deployment and Installing Node.js, npm, and MongoDB in Angular Published at:- Angular 4 Questions - Angular 4 Quiz (MCQ) Published at:- AngularJS MCQ Quiz Questions with Answer Part 2 Published at:- AngularJS MCQ Quiz Questions with Answer Published at:- AngularJS MCQ Quiz Questions with Answer Published at:- Angular Interview Question Set 1 Published at:- Angular Interview Question Set 2 Published at:- Angular Interview Question Set 3 Published at:- Angular Interview Question Set 4 Published at:- Angular Interview Question Set 5 Published at:- Angular Interview Question Set 7 Published at:- Angular Interview Question Set 8 Published at:- Angular Interview Question Set 9 Published at:- Angular Interview Question Set 10 Published at:- Angular Interview Question Set 11 Published at:- Angular Interview Question Set 11 Published at:- Angular Interview Question Set 12 Published at:- Angular Interview Question Set 13 Published at:- Angular Interview Question Set 14 Published at:- Angular Interview Question Set 15 Published at:-
R4Rin Team
The content on R4Rin.com website is created by expert teams.