Angular JS

1. What is AngularJS?
AngularJS is a javascript framework used for creating single web page applications.  It allows you to use HTML as your template language and enables you to extend HTML’s syntax to express your application’s components clearly.
2. What is the difference between one-way binding and two-way binding?
– One way binding implies that the scope variable in the html will be set to the first value its model is bound to (i.e. assigned to)
– Two way binding implies that the scope variable will change it’s value every time its model is assigned to a different value .

3. Explain what is a $scope in AngularJS
Scope is an object that refers to the application model. It is an execution context for expressions. Scopes are arranged in hierarchical structure which mimic the DOM structure of the application. Scopes can watch expressions and propagate events. Scopes are objects that refer to the model. They act as glue between controller and view.
This question is important as it will judge a persons knowledge about a $scope object, and it is one of the most important concepts in AngularJS. Scope acts like a bridge between view and model.
4. What are Directives?
Directives are markers on a DOM element (such as an attribute, element name, comment or CSS class) that tell AngularJS’s HTML compiler ($compile) to attach a specified behavior to that DOM element (e.g. via event listeners), or even to transform the DOM element and its children. Angular comes with a set of these directives built-in, like ngBind, ngModel, and ngClass. Much like you create controllers and services, you can create your own directives for Angular to use. When Angular bootstraps your application, the HTML compiler traverses the DOM matching directives against the DOM elements.
This question is important because directives define the UI while defining a single page app. You need to be very clear about how to create a new custom directive or use the existing ones already pre-build in AngularJS.
5. What is a singleton pattern and where we can find it in Angularjs?
Is a great pattern that restricts the use of a class more than once. We can find singleton pattern in angular in dependency injection and in the services.
In a sense, if you do 2 times ‘new Object()‘ without this pattern, you will be allocating 2 pieces of memory for the same object. With singleton pattern, if the object exists, you reuse it.
6. What is an interceptor? What are common uses of it?
An interceptor is a middleware code where all the $http requests go through.
The interceptor is a factory that are registered in $httpProvider. You have 2 types of requests that go through the interceptor, request and response (with requestError and responseErrorrespectively). This piece of code is very useful for error handling, authentication or middleware in all the requests/responses.
7. How do you share data between controllers?
Create an AngularJS service that will hold the data and inject it inside of the controllers.
Using a service is the cleanest, fastest and easiest way to test.
However, there are couple of other ways to implement data sharing between controllers, like:
– Using events
– Using $parentnextSiblingcontrollerAs, etc. to directly access the controllers
– Using the $rootScope to add the data on (not a good practice)
The methods above are all correct, but are not the most efficient and easy to test.
8. What is the difference between ng-show/ng-hide and ng-if directives?
ng-show/ng-hide will always insert the DOM element, but will display/hide it based on the condition. ng-if will not insert the DOM element until the condition is not fulfilled.
ng-if is better when we needed the DOM to be loaded conditionally, as it will help load page bit faster compared to ng-show/ng-hide.
9. What is a digest cycle in AngularJS?
In each digest cycle Angular compares the old and the new version of the scope model values. The digest cycle is triggered automatically. We can also use $apply() if we want to trigger the digest cycle manually.
10. Where should we implement the DOM manipulation in AngularJS?
In the directives. DOM Manipulations should not exist in controllers, services or anywhere else but in directives.Here is a detailed explanation
11. Is it a good or bad practice to use AngularJS together with jQuery?
It is definitely a bad practice. We need to stay away from jQuery and try to realize the solution with an AngularJS approach. jQuery takes a traditional imperative approach to manipulating the DOM, and in an imperative approach, it is up to the programmer to express the individual steps leading up to the desired outcome.
AngularJS, however, takes a declarative approach to DOM manipulation. Here, instead of worrying about all of the step by step details regarding how to do the desired outcome, we are just declaring what we want and AngularJS worries about the rest, taking care of everything for us. Here is a detailed explanation
12. Explain the concept of scope hierarchy?  How many scope can an application have?
Each angular application consist of one root scope but may have several child scopes. As child controllers and some directives create new child scopes, application can have multiple scopes. When new scopes are formed or created they are added as a children of their parent scope. Similar to DOM, they also creates a hierarchical structure.
13. Mention what are the advantages of using Angular.js framework ?
Advantages of using Angular.js as framework are
  • Supports two way data-binding
  • Supports MVC pattern
  • Support static template and angular template
  • Can add custom directive
  • Supports REST full services
  • Supports form validations
  • Support both client and server communication
  • Support dependency injection
  • Applying Animations
  • Event Handlers
14. Explain what is the difference between link and compile in Angular.js?
  • Compile function: It is used for template DOM Manipulation and collect all of the directives.
  • Link function: It is used for registering DOM listeners as well as instance DOM manipulation. It is executed once the template has been cloned.
15. Explain what is linking function and type of linking function?
Link combines the directives with a scope and produce a live view.  For registering DOM listeners as well as updating the DOM, link function is responsible. After the template is cloned it is executed.
  • Pre-linking function: Pre-linking function is executed before the child elements are linked.  It is not considered as the safe way for DOM transformation.
  • Post linking function: Post linking function is executed after the child elements are linked. It is safe to do DOM transformation by post-linking function
16. Explain what is services in AngularJS ?
In AngularJS services are the singleton objects or functions that are used for carrying out specific tasks.  It holds some business logic and these function can be called as controllers, directive, filters and so on.
17. Explain what is factory method in AngularJS?
For creating the directive, factory method is used.  It is invoked only once, when compiler matches the directive for the first time.  By using $injector.invoke the factory method is invoked.
18. How would you specify that a scope variable should have one-time binding only?
By using “::” in front of it. This allows the check if the candidate is aware of the available variable bindings in AngularJS.
19. Explain how $scope.$apply() works
$scope.$apply re-evaluates all the declared ng-models and applies the change to any that have been altered (i.e. assigned to a new value)
Explanation: $scope.$apply() is one of the core angular functions that should never be used explicitly, it forces the angular engine to run on all the watched variables and all external variables and apply the changes on their values
20. What directive would you use to hide elements from the HTML DOM by removing them from that DOM not changing their styling?
The ngIf Directive, when applied to an element, will remove that element from the DOM if it’s condition is false.
21. What makes the angular.copy() method so powerful?
It creates a deep copy of the variable.
A deep copy of a variable means it doesn’t point to the same memory reference as that variable. Usually assigning one variable to another creates a “shallow copy”, which makes the two variables point to the same memory reference. Therefore if we change one, the other changes as well
22. What is the role of services in AngularJS and name any services made available by default?
– AngularJS Services are objects that provide separation of concerns to an AngularJS app.
– AngularJS Services can be created using a factory method or a service method.
– Services are singleton components. All components of the application (into which the service is injected) will work with single instance of the service.
– An AngularJS service allows developing of business logic without depending on the View logic which will work with it.
Few of the inbuilt services in AngularJS are:
– the $http service: The $http service is a core Angular service that facilitates communication with the remote HTTP servers via the browser’s XMLHttpRequest object or via JSONP
– the $log service: Simple service for logging. Default implementation safely writes the message into the browser’s console
– the $anchorScroll: it scrolls to the element related to the specified hash or (if omitted) to the current value of $location.hash()
Why should one know about AngularJS Services, you may ask. Well, understanding the purpose of AngularJS Services helps bring modularity to AngularJS code.
Services are the best may to evolve reusable API within and AngularJS app
  • AngularJS Services help create reusable components.
  • A Service can be created either using the service() method or the factory() method.
  • A typical service can be injected into another service or into an AngularJS Controller.
23. When creating a directive, it can be used in several different ways in the view. Which ways for using a directive do you know? How do you define the way your directive will be used?
When you create a directive, it can be used as an attribute, element or class name. To define which way to use, you need to set the restrict option in your directive declaration.
The restrict option is typically set to:
‘A’ – only matches attribute name
‘E’ – only matches element name
‘C’ – only matches class name
These restrictions can all be combined as needed:
‘AEC’ – matches either attribute or element or class name
For more information, feel free to check out the AngularJS documentation.
24. When should you use an attribute versus an element?
Use an element when you are creating a component that is in control of the template. Use an attribute when you are decorating an existing element with new functionality.
This topic is important so developers can understand the several ways a directive can be used inside a view and when to use each way.
25. What are the basic steps to unit test an AngularJS filter?
1. Inject the module that contains the filter.
2. Provide any mocks that the filter relies on.
3. Get an instance of the filter using $filter('yourFilterName').
4. Assert your expectations.
Dependency injection is a powerful software design pattern that Angular employs to compose responsibilities through an intrinsic interface. However, for those new to the process, it can be puzzling where you need to configure and mock these dependencies when creating your isolated unit tests. The open-source project “Angular Test Patterns” is a free resource that is focused on dispelling such confusion through high-quality examples.
26. What should be the maximum number of concurrent “watches”? Bonus: How would you keep an eye on that number?
TL;DR Summary: To reduce memory consumption and improve performance it is a good idea to limit the number of watches on a page to 2,000. A utility called ng-stats can help track your watch count and digest cycles.
Jank happens when your application cannot keep up with the screen refresh rate. To achieve 60 frames-per-second, you only have about 16 milliseconds for your code to execute. It is crucial that the scope digest cycles are as short as possible for your application to be responsive and smooth. Memory use and digest cycle performance are directly affected by the number of active watches. Therefore, it is best to keep the number of watches below 2,000. The open-source utility ng-stats gives developers insight into the number of watches Angular is managing, as well as the frequency and duration of digest cycles over time.
Caution: Be wary of relying on a “single magic metric” as the golden rule to follow. You must take the context of your application into account. The number of watches is simply a basic health signal. If you have many thousands of watches, or worse, if you see that number continue to grow as you interact with your page. Those are strong indications that you should look under the hood and review your code.
This question is valuable as it gives insight into how the candidate debugs runtime issues while creating a discussion about performance and optimization.
27. How would you make an Angular service return a promise? Write a code snippet as an example
To add promise functionality to a service, we inject the “$q” dependency in the service, and then use it like so:
angular.factory('testService', function($q){
 return {
  getName: function(){
   var deferred = $q.defer();

   //API call here that returns data

   return deferred.promise;
The $q library is a helper provider that implements promises and deferred objects to enable asynchronous functionality
28. How do you reset a $timeout$interval(), and disable a $watch()?
To reset a timeout and/or $interval, assign the result of the function to a variable and then call the .cancel() function.
var customTimeout = $timeout(function () {
  // arbitrary code
}, 55);

to disable $watch(), we call its deregistration function. $watch() then returns a deregistration function that we store to a variable and that will be called for cleanup
var deregisterWatchFn = $scope.$on(‘$destroy’, function () {
    // we invoke that deregistration function, to disable the watch
29. How would you validate a text input field for a twitter username, including the @ symbol?
You would use the ngPattern directive to perform a regex match that matches Twitter usernames. The same principal can be applied to validating phone numbers, serial numbers, barcodes, zip codes and any other text input.
30. How would you implement application-wide exception handling in your Angular app?
Angular has a built-in error handler service called $exceptionHandler which can easily be overriden as seen below:
myApp.factory('$exceptionHandler', function($log, ErrorService) {
    return function(exception, cause) {
        if (console) {

        ErrorService.send(exception, cause);
This is very useful for sending errors to third party error logging services or helpdesk applications. Errors trapped inside of event callbacks are not propagated to this handler, but can manually be relayed to this handler by calling $exceptionHandler(e) from within a try catch block.
31. Explain what is Angular Expression? Explain what is key difference between angular expressions and JavaScript expressions?
Like JavaScript,  Angular expressions are code snippets that are usually placed in binding such as {{ expression }}
The key difference between the JavaScript expressions and Angular expressions
  • Context : In Angular, the expressions are evaluated against a scope object, while the Javascript expressions are evaluated against the global window
  • Forgiving: In Angular expression evaluation is forgiving to null and undefined, while in Javascript undefined properties generates TypeError or ReferenceError
  • No Control Flow Statements: Loops, conditionals or exceptions cannot be used in an angular expression
  • Filters: To format data before displaying it you can use filters
  • Source
32. What makes AngularJS better ?
  • Registering Callbacks: There is no need to register callbacks . This makes your code simple and easy to debug.
  • Control HTML DOM programmatically:  All the application that are created using Angular never have to manipulate the DOM although it can be done if it is required
  • Transfer data to and from the UI: AngularJS helps to eliminate almost all of the boiler plate like validating the form, displaying validation errors, returning to an internal model and so on which occurs due to flow of marshalling data
  • No initilization code: With AngularJS you can bootstrap your app easily using services, which auto-injected into your application in Guice like dependency injection style
33. Explain what is string interpolation in Angular.js ?
In Angular.js the compiler during the compilation process matches text and attributes using interpolate service to see if they contains embedded expressions.  As part of normal digest cycle these expressions are updated and registered as watches.
34. Mention the steps for the compilation process of HTML happens?
Compilation of HTML process occurs in following ways
  • Using the standard browser API, first the HTML is parsed into DOM
  • By using the call to the $compile () method, compilation of the DOM is performed.  The method traverses the DOM and matches the directives.
  • Link the template with scope by calling the linking function returned from the previous step
35. Explain what is linking function and type of linking function?
Link combines the directives with a scope and produce a live view.  For registering DOM listeners as well as updating the DOM, link function is responsible. After the template is cloned it is executed.
  • Pre-linking function: Pre-linking function is executed before the child elements are linked.  It is not considered as the safe way for DOM transformation.
  • Post linking function: Post linking function is executed after the child elements are linked. It is safe to do DOM transformation by post-linking function
 36. Explain what is directive and Mention what are the different types of Directive?
During compilation process when specific HTML constructs are encountered a behaviour or function is triggered, this function is referred as directive.  It is executed when the compiler encounters it in the DOM.
Different types of directives are
  • Element directives
  • Attribute directives
  • CSS class directives
  • Comment directives
37. What's the difference between factory and service?
They both allow us to create an object that can then be used anywhere in our app.
Most important is to realize that both are singletons in your app, even though the name “factory” might imply differently.
Essentially, factories are functions that return the object, while services are constructor functions of the object which are instantiated with the new keyword.
To the users of our services and factories it all looks the same. This code below would be written the same regardless of which was used:
.controller('TheCtrl', function($scope, SomeService) { SomeService.someFunction(); });
Here is a matching factory:

angular.module('app').factory('SomeService', function() {
    return {
        someFunction: function() {}

This will result in an injectable object called SomeService with a single public function someFunction.
And here is a matching service:

angular.module('app').service('SomeService', function() {
    this.someFunction = function() {};
For more Service-vs-Factory
38. Explain what is injector?
An injector is a service locator.  It is used to retrieve object instances as defined by provider, instantiate types, invoke methods and load modules.  There is a single injector per Angular application, it helps to look up an object instance by its name. For More
39. Explain what is DI (Dependency Injection ) and how an object or function can get a hold of its dependencies ?
DI or Dependency Injection is a software design pattern that deals with how code gets hold of its dependencies.  In order to retrieve elements of the application which is required to be configured when module gets loaded , the operation “config” uses dependency injection.
These are the ways that object uses to hold of its dependencies
  • Typically using the new operator, dependency can be created
  • By referring to a global variable, dependency can be looked up
  • Dependency can be passed into where it is required
  • For More
40. Explain what is Bootstraping?
Bootstrap function is used to manually start up angular application
41. What is $location? When we should use it.
The $location service parses the URL in the browser address bar (based on window.location) and makes the URL available to your application. Changes to the URL in the address bar are reflected into the $location service and changes to $location are reflected into the browser address bar.
The $location service:
  • Exposes the current URL in the browser address bar, so you can
    • Watch and observe the URL.
    • Change the URL.
  • Maintains synchronization between itself and the browser's URL when the user
    • Changes the address in the browser's address bar.
    • Clicks the back or forward button in the browser (or clicks a History link).
    • Clicks on a link in the page.
  • Represents the URL object as a set of methods (protocol, host, port, path, search, hash).
When you use $location to update browser URL, this just loads a new route and does not cause a full page refresh. If you want to trigger a full page refresh, or redirect the user to a different website or URL, you can do that using $window.location.href.
When should I use $location?
Any time your application needs to react to a change in the current URL or if you want to change the current URL in the browser. For more$location
42. What points do you need to notice while running an angular app in Production?
For better understand please visit
43. Five Awesome features of AngularJS
1. Two way Data-Binding
2. Templates
3. MVC
4. Dependency Injection
5. Directives
6. Testing
For more please visit
44. What are $apply, $watch, $digest methods.
Check my post Here

Linkedin: Bhanu Pratap
Facebook: /Bhanu Pratap


  1. Replies
    1. Yes If you have any question, you can post in comments I will reply with a new Post and I will let you know. Thanks

  2. Unique questions, I used to follow up this during interviews, Thanks for the points. AngularJS extends HTML with new attributes.
    AngularJS is perfect for Single Page Applications (SPAs).

    AngularJS is easy to learn.

    Learn AngularJS now!


  3. Given so much info in it, These type of articles keeps the users interest in the website, and keep on sharing more ..Best Angularjs Training in Chennai|Angularjs Training in Chennai

  4. This comment has been removed by the author.

  5. We are one of the prominent Angulr Js Training in Chennai and Best Angularjs Training in Chennai. Offering online training and classroom training at most reasonable cost.

  6. It's very nice blog. I'm so happy to gain some knowledge from here. Thank you for valuable information on
    AngularJS Training in Chennai.
    Hoping to get more info...

  7. Nice blog. Thanks for sharing such great information.Inwizards Inc is a Angularjs Development company offers quality Angular.js development services best in software industries. Intrested click here - Angularjs Development Services

  8. Good Information shared with people who are looking for this, Thanks for providing Angularjs Online course

  9. Australia Best Tutor is one of the best Online Assignment Help providers at an affordable price. Here All Learners or Students are getting best quality assignment help with reference and styles formatting.

    Visit us for more Information

    Australia Best Tutor
    Sydney, NSW, Australia
    Call @ +61-730-407-305
    Live Chat @

    Our Services

    Online assignment help Australia
    my assignment help Australia
    assignment help
    help with assignment
    Online instant assignment help
    Online Assignment help Services

  10. Thanks for providing good information,Thanks for your sharing.Angularjs Online Training Hyderabad

  11. Great efforts put it to find this useful. Thanks for your article.We are also one of the best sources to learn
    Angular JS Training in Chennai | Angular JS Training Institute in Chennai

  12. After reading this blog i very strong in this topics and this blog really helpful to all AngularJS5 Online Course Bangalore

  13. Thank you for sharing valid information about software angularjs

    AngularJS Training in Hyderabad

  14. Thank you for sharing valid information about software angularjs

    AngularJS Training in Hyderabad

  15. Excellent website. Lots of useful information here, thanks in your effort! . For more information please visit

    AngularJS Online Training

    AngularJS Online Training Hyderabad

    AngularJS Online Course

    AngularJS Online course Hyderabad

  16. Each department of CAD have specific programmes which, while completed could provide you with a recognisable qualification that could assist you get a job in anything design enterprise which you would really like.

    AutoCAD training in Noida

    AutoCAD training institute in Noida

    Best AutoCAD training institute in Noida

  17. Really nice blog post.provided a helpful information.I hope that you will post more updates like this AngularJS4 Online Course

  18. Thank you for sharing valid information about software AngularJS

    Training in Hyderabad

  19. Great one,You have done a great job by sharing this content,Thank you a lot for providing individuals with a very spectacular possibility to read critical reviews from this site.

    Python Training in Chennai
    Python Training

  20. Good Post! Thank you so much for sharing this pretty post, it was so good to read and useful to improve my knowledge as updated one, keep blogging.
    Devops Training in pune|Devops training in tambaram|Devops training in velachery|Devops training in annanagar
    DevOps online Training

  21. Inspiring writings and I greatly admired what you have to say , I hope you continue to provide new ideas for us all and greetings success always for you..Keep update more information..

    rpa training in Chennai | rpa training in pune

    rpa training in tambaram | rpa training in sholinganallur

    rpa training in Chennai | rpa training in velachery

    rpa online training | rpa training in bangalore

  22. Your good knowledge and kindness in playing with all the pieces were very useful. I don’t know what I would have done if I had not encountered such a step like this.
    java training in tambaram | java training in velachery

    java training in omr | oracle training in chennai

  23. Really I Appreciate The Effort You Made To Share The Knowledge. This Is Really A Great Stuff For Sharing. Keep It Up . Thanks For Sharing.

    Mobile Apps Training
    Mobile Apps Training in Chennai

  24. Nice and good article.Thanks for sharing this useful information. If you want to learn Angular js course online, please visit below site.
    Angular js online training
    Angular js online course
    Angular js Online Training in Hyderabad
    Angular js Online Training in Bangalore
    Angular js Online Training in Chennai

  25. No matter how you learn best, Web Designing Training in Bangalore. For those looking for an in-depth experience in Web Designing, Enroll Today at myTectra
    web designing training in bangalore

  26. Best kitchen chimney installation and service in Faridabad
    When cooking with oil, you will see the fact that smoke usually receives emitted in case you often uses the identical oil. Typically, these form of eating places have today's hoods as well as exhaust fans.
    Visit here
    Kitchen Chimney Repair Service in Noida
    Kitchen Kitchen Chimney Repair Service in Vaishali
    Kitchen Kitchen Chimney Repair Service in indirapuram
    Kitchen Kitchen Chimney Repair Service in vasundhra
    Kitchen Kitchen Chimney Repair Service in faridabad

  27. Thank you so much for your information!!! Zinavo Technologies provide web design & development with good quality if security in your website. Website Design Company in Bangalore | Web Designing Company in Bangalore | Web Developers in Bangalore Bangalore

  28. Thank you so much for your information!!! Zinavo Technologies provide web design & development with good quality if security in your website. Web Designers in Bangalore | Website Designers in Bangalore | Website Design in Bangalore Bangalore

  29. Howdy, would you mind letting me know which web host you’re utilizing? I’ve loaded your blog in 3 completely different web browsers, and I must say this blog loads a lot quicker than most. Can you suggest a good internet hosting provider at a reasonable price?
    Best AWS Amazon Web Services Training in Chennai | Best AWS Training and Certification for Solution Architect in Chennai
    Amazon Web Services Training in Tambaram, Chennai|Best AWS Training in Tambaram, Chennai

  30. From your discussion I have understood that which will be better for me and which is easy to use. Really, I have liked your brilliant discussion. I will comThis is great helping material for every one visitor. You have done a great responsible person. i want to say thanks owner of this blog.
    python course in pune
    python course in chennai
    python Training in Bangalore

  31. I prefer to study this kind of material. Nicely written information in this post, the quality of content is fine and the conclusion is lovely. Things are very open and intensely clear explanation of issues
    Java training in Bangalore | Java training in Indira nagar

    Java training in Bangalore | Java training in Rajaji nagar

    Java training in Bangalore | Java training in Marathahalli

    Java training in Bangalore | Java training in Btm layout

  32. Really a great post. Appreciate the effort in educating us. We are also same service provides in Bangalore.
    Web Design Company in Bangalore
    Website Designers in Bangalore
    Website Development Company in Bangalore

  33. Great Article… I love to read your articles because your writing style is too good, its is very very helpful for all of us and I never get bored while reading your article because, they are becomes a more and more interesting from the starting lines until the end.

    rpa training in chennai
    Best rpa training in bangalore
    rpa course in bangalore
    rpa training in marathahalli
    rpa training in btm
    best rpa training in chennai

  34. Good Post! Thank you so much for sharing this pretty post, it was so good to read and useful to improve my knowledge as updated one, keep blogging.
    Best Devops online Training
    Online DevOps Certification Course - Gangboard

  35. The blog was absolutely fantastic! Lot of great information which can be helpful in some or the other way. Keep updating the blog, looking forward for more contents...Great job, keep it up..Website Design Company in Bangalore | Web Design Companies in Bangalore | Website Design Companies in Bangalore

  36. Thank you so much for your information!!! Zinavo Technologies provide web design & development with good quality if security in your website.Web Development Company in Bangalore | Website Designing Companies in Bangalore | Top Web Design Company in Bangalore

  37. You are doing a great job. I would like to appreciate your work
    Machine Learning Training


  38. Whoa! I’m enjoying the template/theme of this website. It’s simple, yet effective. A lot of times it’s very hard to get that “perfect balance” between superb usability and visual appeal. I must say you’ve done a very good job with this.
    aws training in bangalore
    RPA Training in bangalore
    Python Training in bangalore
    Selenium Training in bangalore
    Hadoop Training in bangalore

  39. Great post and informative was awesome to read, thanks for sharing this great content to my vision.

    CEH Training In Hyderbad

  40. Thanks for posting these blog related to SAS.It will be really useful for my preparation.Keep posting such essential blogs.
    SAS course