Read Angular js interview questions including topic advanced topics like Dependency injection, Two-way binding, scope in angular js and many more.
1.Explain Directive scopes?
There are three types of directive scopes available in Angular.
- Parent Scope: is default scope
- Child Scope: If the properties and functions you set on the scope are not relevant to other directives and the parent, you should probably create a new child scope.
- Isolated Scope: Isolated Scope is used if the directive you are going to build is self-contained and reusable. Does not inherit from parent scope, used for private/internal use.
-
How to isolate a directive’s Scope in Angular?
You can isolate a directive’s Scope by passing an object to the scope option of directive.
This tells the directive to keep scope inside of itself and not to inherit or share with other scopes.
-
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
testAPI.getName().then(function(name){
deferred.resolve(name)
})
return deferred.promise;
}
}
})
The $q library is a helper provider that implements promises and deferred objects to enable asynchronous functionality
Source: https://docs.angularjs.org/api/ng/service/$q
-
Explain how does Angular implement two-way binding?
Data-binding in Angular apps is the automatic synchronization of data between the model and view components. The way that Angular implements data-binding lets you treat the model as the single-source-of-truth in your application. The view is a projection of the model at all times. When the model changes, the view reflects the change and vice versa.
-
What is the difference between $scope and scope?
In Angular js $scope is used whenever we have to use dependency injection (D.I) whereas as the scope is used for directive linking.
-
What is Angular’s prefixes $ and $$?
Angular uses these prefixes to prevent accidental code collision with users code.
$ prefix is used with public objects whereas $$ prefix is used with a single public object.
-
What is the difference between a link and compile in Angular JS?
- Compile function: To template DOM manipulation and to gather all the directives, the compile function is used.
- Link function: To register DOM listeners as well as for the instance DOM manipulation, the Link function is used.
-
How do you share data between controllers in AngularJs?
We can share data by creating a service, Services are easiest, fastest and cleaner way to share data between controllers in AngularJs.
There are also other ways to share data between controllers, they are
- Using Events
- $parent, nextSibling, controllerAs
- Using the $rootScope
-
What is internationalization in Angularjs?
Internationalization is a way to show locale-specific information on a website. It is used to create multilingual language websites.
-
What is dependency injection and how does it work?
AngularJS was designed to highlight the power of dependency injection, a software design pattern that places an emphasis on giving components their dependencies instead of hardcoding them within the component. For example, if you had a controller that needed to access a list of customers, you would store the actual list of customers in a service that can be injected into the controller instead of hardcoding the list of customers into the code of the controller itself. In AngularJS you can inject values, factories, services, providers, and constants.
-
List some of the built-in validators in Angular JS?
Angular js supports all standard HTML5 attributes to validate input.Below are few built-in validators in Angular js.
- required
- min
- max
- type=”number” OR type=”email”
-
How to access parent scope from child controller in Angular JS?
In angular there is a scope variable called $parent (i.e. $scope.$parent). $parent is used to access parent scope from child controller in Angular JS.
Example:
<div ng-controller="ParentCtrl">
<h1>{{ name }}</h1>
<p>{{ address }}</p>
<div ng-controller="ChildCtrl">
<h1>{{ title }}</h1>
<input type="text" ng-model="$parent.address" />
</div>
</div>
Now that you’ve read all the AngularJS interview questions and answers above, you are a step closer to passing your interview and getting your dream job.
If you feel that you need to refresh your knowledge on some concepts and master front-end web development with Angular, consider reading our other articles on AngularJS.
Arif Khoja is a Developer. He is a Javascript Enthusiatic who loves logical programming and has first hand experience in building a cutting edge internet product using Angular. He is also an open source freak and keen about learning and sharing. He writes Javascript both frontend and backend. He loves learning and sharing tech all the time. He also has a hands on experience in SEO and writes articles about latest emerging technologies.
