angularjs interview questions and answers

AngularJS Interview Questions and Answers

by GangBoard Admin, October 30, 2018

In case you’re searching for AngularJS Interview Questions and answers for Experienced or Freshers, you are at the correct place. There is parcel of chances from many presumed organizations on the planet. The AngularJS advertise is relied upon to develop to more than $5 billion by 2020, from just $180 million, as per AngularJS industry gauges. In this way, despite everything you have the chance to push forward in your vocation in AngularJS Development. Gangboard offers Advanced AngularJS Interview Questions and answers that assist you in splitting your AngularJS interview and procure dream vocation as AngularJS Developer.

Best AngularJS Interview Questions and Answers

Do you believe that you have the right stuff to be a section in the advancement of future AngularJS, the GangBoard is here to control you to sustain your vocation. Various fortune 1000 organizations around the world are utilizing the innovation of AngularJS to meet the necessities of their customers. AngularJS is being utilized as a part of numerous businesses. To have a great development in AngularJS work, our page furnishes you with nitty-gritty data as AngularJS prospective employee meeting questions and answers. AngularJS Interview Questions and answers are prepared by 10+ years experienced industry experts. AngularJS Interview Questions and answers are very useful to the Fresher or Experienced person who is looking for the new challenging job from the reputed company. Our AngularJS Questions and answers are very simple and have more examples for your better understanding.

By this AngularJS Interview Questions and answers, many students are got placed in many reputed companies with high package salary. So utilize our AngularJS Interview Questions and answers to grow in your career. 

Q1) How do you add form validation to a form built with FormBuilder?


this.username = new FormControl(‘user’, Validators.required);

Q2) What’s the difference between dirty, touched, and pristine on a form element?


  • dirty – interacted to control
  • touched – focus to control
  • prestine – not interacted to control

Q3) How can you access validation errors in the template to display error messages?


*ngIf=”name.invalid && (name.dirty || name.touched)”


Q4) What is async validation and how is it done?


async will check for duplicate entry. its done using HTTP service and bind control with map

Q5) What is the purpose of NgModule?


to export component, service, directives, and pipes to other modules inside an application

Q6) How do you decide to create a new NgModule?


when there is a common usage of a feature in an application.

Q7) What are the attributes that you can define in an NgModule annotation?


declare module and import components and services

Q8) What is the difference between a module’s forRoot() and forChild() methods and why do you need it?


forRoot() = service register to entire application

forChild() = service register to particular child component

Q9) What would you have in a shared module?


core independent directives, pipes, and components

Q10) What would you not put shared module?


dependent directives, pipes, and components

Q11) What module would you put a singleton service whose instance will be shared throughout the application (e.g. ExceptionService andLoggerService)?



Q12) What is the purpose of exports in a NgModule?


to expose them to the imported module

 Q13) What is the difference between exports and declarations in NgModule?


export visible to other imported module

a declaration will make component visible inside the module

Q14) Why is it bad if SharedModule provides a service to a lazily loaded module?


dependency to other non-lazy modules

Q15) What is the use case of services?


to share data across components

Q16) How are the services injected to your application?


constructor(private myService:MyService){}

Q17) How do you unit test a service with a dependency?


Using TestBed


providers: [AuthService]


Q18) Why is it a bad idea to create a new service in a component like the one below?


bad question – no sample provided

Q19) What is the possible order of lifecycle hooks.


  • ngOnChanges()
  • ngOnInit()
  • ngAfterViewInit()
  • ngOnDestroy()

Q20) When will ngOnInit be called?


after angular displays first bound properties

Q21) How would you make use of ngOnInit()?


set default values from observable services

Q22) What would you consider a thing you should be careful doing on ngOnInit()?


not understandable

Q23) What is the difference between ngOnInit() and constructor() of a component?


  • constructor – injecting services and declaration
  • ngOnInit – to assign values and use services

Q24) What is a good use case for ngOnChanges()?


respond when data inbound to component

Q25) What is the difference between an observable and a promise?


  • observable are cancelable and use subscribe
  • promise are non-cancelable and always returns

 Q26) What is the difference between an observable and a subject


A RxJS Subject is a special type of Observable that allows values to be multicasted to many Observers. While plain Observables are unicast

(each subscribed Observer owns an independent execution of the Observable), Subjects are multicast.

A Subject is like an Observable, but can multicast to many Observers. Subjects are like EventEmitters: they maintain a registry of many listeners.

 Q27) What are some of the angular apis that are using observables?


Angular HTTP uses observables

Q28) How would you cache an observable data?


We need the following things to implement caching in observables:

  • An injectable cache service
  • Ability to set an expiration for each item.
  • An Observable based service
  • Ability to track on the fly requests so duplicate requests are never made.

 Q29) How would you implement a multiple API calls that need to happen in order using rxjs?


Method 1:

this.http.get(‘/api/url’).subscribe(data => {

this.http.get(/api/url/data).subscribe(data1 => {

// code goes here



Method 2:

Using “MergeMap”


mergeMap(character => this.http.get(character.homeworld))


 Q30) What is the difference between switch map, concatMap, and mergeMap?


switchMap: unsubscribing from the last mapped observable, when the new one arrives.

concatMap: Queuing up every new Observable, and subscribing to a new observable only when the last observable completed.

mergeMap: deciding not to do anything, basically, we just keep subscribing to every new observable that we return from the map.

 Q31) How would you make sure an API call that needs to be called only once but with multiple conditions. Example: if you need to get some data in multiple routes but, once you get it, you can reuse it in the routes that need it, therefore no need to make another call to your backend APIs.


I can store data in a  singleton service, which its object is created once and it won’t get destroyed

throughout the application. So even routes get changes the data will be available in other routes

Q32) If you need to respond to two different Observable/Subject with one callback function, how would you do it?(ex: if you need to change the url through route parameters and with prev/next buttons).


I can create page change Subject and I can emit when route parameters change or next/prev button change.

 Q33) What is the difference between scan() vs reduce() ?


Scan: apply a function to each item emitted by an Observable, sequentially, and emit each successive value

Reduce: apply a function to each item emitted by an Observable, sequentially, and emit the final value

 Q34) What is a pure pipe?


A pure pipe is only called when Angular detects a change in the value or the parameters passed to a pipe

Q35) What is an async pipe?


The async pipe subscribes to an Observable or Promise and returns the latest value it has emitted.

When a new value is emitted, the async pipe marks the component to be checked for changes.

When the component gets destroyed, the async pipe unsubscribes automatically to avoid potential memory leaks.

 Q36) What kind of data can be used with an async pipe?


Promise, Observable

Q37) How does async pipe prevent memory leeks?


When a component gets destroyed, the async pipe unsubscribes automatically to avoid potential memory leaks.

 Q38) What is the difference between pure and impure pipes


A pure pipe is only called when Angular detects a change in the value or the parameters passed to a pipe. An impure pipe is called for every change detection cycle no matter whether the value or parameters changes.

 Q39) What is the minimum definition of a component?


A component is class that is used to building block in Angular

Q40) What is the difference between a component and a directive?


Components are their own HTML and Style(View), Directive is just behavior to extend the elements of the component.

Q41) How do components communicate with each other


Three-way to communicate components:

  • Passing the of one component to another component
  • passing value through parent component
  • passing through service

 Q42) How do you create two-way data binding in Angular?


combines the input and output binding into a single notation using the ngModel directive.

Eg: <input [(ngModel)]=”name” >  {{name}}

Q43) How would you create a component to display error messages throughout your application?


Set the error message equal to an angular variable and then check if that variable exists to decide whether to display value or Error.

Q44) What does a lean component mean to you?


The lean component we use for only display the data only.

Q45) When do you use template-driven vs model-driven forms? Why


Template driven are simple forms which do not involve complicated logic code. Model-driven are more advanced and it customization the functionality and flexibility.

Q46) How do you submit a form?


using ngSubmit()

Q47) What’s the difference between NgForm, FormGroup, and FormControl? How do they work together?


ngForm:- When we import the Form module, NgForm automatically attaches to the tags, it always works from behind.

Q48) What’s the advantage of using FormBuilder?


FormBuilder reduces creating instances of a FormControl, FormGroup, or FormArray. It reduces the amount of boilerplate needed to build complex forms.

Q49) What is the difference between RouterModule.forRoot() vs RouterModule.forChild()? Why is it important?


RouterModule.forRoot is a static method and it helps to configure the modules.

RouterModule.forChild() is a static method used to configure the routes of lazy-loaded modules.

Q50) Can you explain the difference between ActivatedRoute and RouterState?

Ans: ActivatedRoute can be reused, and it will give all property and objects.

RouterState doesn’t create a new activated route.

Q51) How do you debug router?


Can be activated by passing a flag when it’s added to the app routes.



imports: [ RouterModule.forRoot(routes, { enableTracing: true }) ],

exports: [ RouterModule ]


export class AppRoutingModule {}

Q52) Why do we need route guards?


route guards are interfaces which can tell the router to allow or not the navigation to a requested route.

 Q53) What is a RouterOutlet?


RouterOutlet use to bind the components when navigation is called.

 Q54) How do you mock a service to inject in a unit test?


by using $provide.

 Q55) How do you mock a module in a unit test?


Mock functions are also known as “spies” because they let you spy on the behavior of a function that is called indirectly by some other code.

 Q56) What is the difference between an Interface and a Class?


An interface is a contract.

Abstract classes look a lot like interfaces, but they have something more.

 Q57) First line below gives a compile error, the second line doesn’t. Why?


it will give like one by one line, after excuting the first line then it will response getting wrong

Related Post

No Comments

Leave a Reply

Your email address will not be published Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>


Online Training Quick Enquiry

Get Free Online training