Top 44 Angular Js Interview Questions
Q1. Explain Ng-show Directive?
Ng-show directive suggests a given manipulate.
In underneath instance, we’ve added ng-show attribute to a HTML button and bypass it a version. Then we’ve attached the model to a checkbox and might see the variant.
<input type = “checkbox” ng-model = “showHide1”>Show Button
<button ng-show = “showHide1”>Click Me!</button>
Q2. How Angular.Module Works?
Angular.Module is used to create AngularJS modules along with its established modules.
Consider the following example:
var mainApp = angular.Module(“mainApp”, []);
Here we’ve declared an software mainApp module using angular.Module function. We’ve handed an empty array to it. This array commonly incorporates dependent modules declared in advance.
Q3. What Are Angular Js Expressions?
Expressions are used to bind utility records to html. Expressions are written inside double braces like expression. Expressions behave in same manner as ng-bind directives. AngularJS application expressions are natural JavaScript expressions and outputs the information wherein they're used.
Q4. Which Are The Core Directives Of Angular Js?
Following are the 3 middle directives of AngularJS.
•ng-app − This directive defines and links an AngularJS utility to HTML.
•ng-version − This directive binds the values of AngularJS software facts to HTML enter controls.
•ng-bind − This directive binds the AngularJS Application information to HTML tags.
Q5. What Is Service Method?
Using service method, we outline a carrier after which assign technique to it. We’ve also injected an already to be had provider to it.
MainApp.Carrier(‘CalcService’, feature(MathService)
this.Square = characteristic(a)
return MathService.Multiply(a,a);
);
Q6. Explain Ng-app Directive?
Ng-app directive defines and links an AngularJS application to HTML. It also suggest the begin of the software.
Q7. What Is Angular Js?
Angular JS is a framework to construct massive scale and high performance net software even as retaining them as smooth-to-preserve.
Following are the features of Angular JS framework.
1.Angular JS is a powerful JavaScript primarily based development framework to create RICH Internet Application (RIA).
2.Angular JS provides developers alternatives to write down patron facet application (the use of JavaScript) in a easy MVC (Model View Controller) way.
Three.Application written in Angular JS is pass-browser compliant. Angular JS robotically handles JavaScript code appropriate for each browser.
Four.Angular JS is open supply, completely loose, and used by heaps of developers around the sector. It is licensed under the Apache License model 2.0.
Q8. What Is Scope In Angular Js?
Scopes are objects that talk over with the version. They act as glue between controller and consider.
Q9. Explain Ng-bind Directive ?
Ng-bind directive binds the AngularJS Application records to HTML tags. Ng-bind updates the model created through ng-model directive to be displayed within the html tag on every occasion consumer enter some thing inside the manipulate or updates the html manipulate’s data when model information is updated by way of controller.
Q10. Explain Filter Filter?
Clear out filter is used to clear out the array to a subset of it based on furnished standards.
In below instance, to display only required topics, we’ve used subjectName as filter out.
Enter problem: <input type = “text” ng-model = “subjectName”>
Subject:
<ul>
<li ng-repeat = “subject in student.Subjects issue.Name + ‘, marks:’ + difficulty.Marks
</li>
</ul>
Q11. What Is Internationalization?
Internationalization is a way to reveal locale precise statistics on a website. For example, display content material of a website in English language in United States and in Danish in France.
Q12. What Are The Services In Angular Js?
Angular JS include several integrated services. For instance $http service is used to make XMLHttpRequests (Ajax calls). Services are singleton items which are instantiated only as soon as in app.
Q13. How Angular Js Integrates With Html?
AngularJS being a natural javaScript primarily based library integrates without difficulty with HTML.
Step 1 − Include angularjs javascript libray in the html page
<head> src = “http://ajax.Googleapis.Com/ajax/libs/angularjs/1.Three.14/angular.Min.Js”> </head>
Step 2 − Point to AngularJS app
Next we inform what a part of the HTML contains the AngularJS app. This carried out by using adding the ng-app attribute to the basis HTML detail of the AngularJS app. You can both upload it to html element or frame element as shown underneath:
<body ng-app = “myapp”> </body>
Q14. How To Implement Internationalization In Angular Js?
Angular JS supports in-built internationalization for three varieties of filters foreign money, date and numbers. We best want to comprise corresponding js in step with locale of the country. By default it handles the locale of the browser. For example, to apply Danish locale, use following script
Q15. What Is Use Of $routeprovider In Angular Js?
$routeProvider is the key carrier which set the configuration of urls, maps them with the corresponding html web page or ng-template, and attaches a controller with the identical.
Q16. Explain Ng-init Directive ?
Ng-init directive initializes an AngularJS Application statistics. It is used to position values to the variables to be used in the application.
Q17. Explain Currency Filter?
Currency filter codecs text in a foreign money format.
In beneath example, we’ve brought foreign money clear out to an expression returning range the use of pipe person. Here we’ve added foreign money clear out to print prices using foreign money layout.
Enter prices: <input type = “text” ng-model = “student.Fees”>
fees: pupil.Prices forex
Q18. What Is A Service?
Services are JavaScript capabilities and are accountable to do particular responsibilities handiest. Each carrier is liable for a selected project as an example, $http is used to make ajax name to get the server information. $direction is used to define the routing data and so on. Inbuilt offerings are continually prefixed with $ symbol.
Q19. What Are The Filters In Angular Js?
Filters choose a subset of items from an array and return a brand new array. Filters are used to show filtered objects from a list of items based on described criteria.
Q20. Explain Ng-conceal Directive?
Ng-disguise directive hides a given manage.
In underneath instance, we’ve delivered ng-conceal characteristic to a HTML button and skip it a model. Then we’ve connected the model to a checkbox and may see the variation.
<input type = “checkbox” ng-model = “showHide2”>Hide Button
<button ng-hide = “showHide2”>Click Me!</button>
Q21. What Is Factory Method?
Using manufacturing facility technique, we first define a manufacturing facility and then assign technique to it.
Var mainApp = angular.Module(“mainApp”, []);
mainApp.Factory(‘MathService’, characteristic()
var manufacturing unit = ;
manufacturing unit.Multiply = feature(a, b)
return a * b
return manufacturing unit;
);
Q22. How To Make An Ajax Call Using Angular Js?
AngularJS affords $http manage which fits as a service to make ajax name to examine records from the server. The server makes a database name to get the desired records. AngularJS desires data in JSON format. Once the statistics is ready, $http can be used to get the statistics from server in the following way:
function studentController($scope, $http)
var url = “information.Txt”;
$http.Get(url).Success( function(reaction)
$scope.College students = reaction;
);
Q23. What Is Constant?
Constants are used to bypass values at config segment considering the truth that price can not be was once exceeded throughout config segment.
MainApp.Consistent(“configParam”, “steady cost”);
Q24. What Is $rootscope?
Scope is a special JavaScript object which performs the position of becoming a member of controller with the perspectives. Scope consists of the model records. In controllers, version statistics is accessed via $scope object. $rootScope is the determine of all of the scope variables.
Q25. Explain Ng-repeat Directive ?
Ng-repeat directive repeats html elements for each object in a group.
Q26. What Are The Differences Between Service And Factory Methods?
Manufacturing unit technique is used to define a manufacturing unit that may later be used to create offerings as and when required whereas carrier approach is used to create a provider whose reason is to perform a little defined mission.
Q27. Explain Ng-controller Directive ?
Ng-controller directive tells AngularJS what controller to apply with this view. AngularJS software mainly is based on controllers to manipulate the drift of facts inside the software. A controller is a JavaScript object containing attributes/houses and features. Each controller accepts $scope as a parameter which refers back to the utility/module that controller is to manipulate.
Q28. What Is Routing In Angular Js?
It is concept of switching views. Angular JS primarily based controller makes a decision which view to render primarily based on the enterprise common sense.
Q29. Explain Ng-model Directive?
Ng-version directive binds the values of AngularJS application statistics to HTML enter controls. It creates a model variable which can be used with the html web page and within the field manage( as an instance, div) having ng-app directive.
Q30. Explain Uppercase Filter?
Uppercase filter out converts a textual content to upper case textual content.
In underneath instance, we’ve added uppercase filter to an expression using pipe person. Here we’ve introduced uppercase filter out to print scholar name in all capital letters.
Enter first call:<input type = “text” ng–model = “student.FirstName”>
Enter closing name: <input type = “text” ng–model = “student.LastName”>
Name in Upper Case: pupil.FullName()
Q31. How To Validate Data In Angular Js?
AngularJS enriches shape filling and validation. We can use $grimy and $invalid flags to do the validations in seamless way. Use novalidate with a shape announcement to disable any browser unique validation.
Following may be used to track mistakes.
$grimy − states that cost has been modified.
$invalid − states that price entered is invalid.
$errors − states the precise errors.
Q32. What Is Deep Linking In Angular Js?
Deep linking allows you to encode the country of utility in the URL so that it could be bookmarked. The utility can then be restored from the URL to the equal country.
Q33. Is Angular Js Extensible?
Yes! In AngularJS we are able to create custom directive to extend AngularJS existing functionalities.
Custom directives are utilized in AngularJS to extend the capability of HTML. Custom directives are described the use of “directive” feature. A custom directive truly replaces the element for which it's far activated.
AngularJS software at some stage in bootstrap finds the matching elements and do one time activity the use of its assemble() method of the custom directive then process the detail the use of hyperlink() method of the custom directive primarily based on the scope of the directive.
Q34. Explain Templates In Angular Js.
Templates are the rendered view with information from the controller and model. These may be a single record (like index.Html) or a couple of perspectives in a single web page the usage of “partials”.
Q35. Explain Ng-disabled Directive?
Ng-disabled directive disables a given manipulate.
In beneath instance, we’ve brought ng-disabled attribute to a HTML button and bypass it a version. Then we’ve connected the version to an checkbox and might see the version.
<input type = “checkbox” ng-model = “enableDisableButton”>Disable Button
<button ng-disabled = “enableDisableButton”>Click Me!</button>
Q36. What Are The Controllers In Angular Js?
Controllers are JavaScript features that are certain to a selected scope. They are the prime actors in Angular JS framework and bring features to operate on records and decide which view is to be up to date to expose the updated model primarily based records.
Q37. What Is Data Binding In Angular Js?
Data binding is the automatic synchronization of data among version and look at additives. Ng-model directive is used in facts binding.
Q38. Explain Order By Filter?
Orderby filter out orders the array primarily based on furnished criteria.
In under instance, to order topics by means of orderBy:’marks'”>
challenge.Call + ‘, marks:’ + concern.Marks
</li>
</ul>
Q39. Which Components Can Be Injected As A Dependency In Angular Js?
Angular JS provides a ideal Dependency Injection mechanism. It offers following middle additives which may be injected into each other as dependencies.
1.Value
2.Manufacturing unit
three.Provider
four.Provider
5.Consistent
Q40. Explain Directives In Angular Js.
Directives are markers on DOM factors (consisting of elements, attributes, css, and greater). These can be used to create custom HTML tags that function new, custom widgets. Angular JS has integrated directives (ng-bind, ng-model, and many others) to perform maximum of the undertaking that builders need to do.
Q41. Explain Ng-click on Directive?
Ng-click directive represents a AngularJS click event.
In below example, we’ve brought ng-click attribute to a HTML button and introduced an expression to up to date a model. Then we will see the variant.
<p>Total click on: clickCounter </p></td>
<button ng-click = “clickCounter = clickCounter + 1”>Click Me!</button>
Q42. Explain Angular Js Boot Process.
When the page is loaded within the browser, following things take place:
· HTML report is loaded into the browser, and evaluated with the aid of the browser. Angular JS JavaScript file is loaded; the angular worldwide object is created. Next, JavaScript which registers controller functions is performed.
· Next Angular JS sc through the HTML to search for Angular JS apps and views. Once view is positioned, it connects that view to the corresponding controller feature.
· Next, Angular JS executes the controller capabilities. It then renders the views with information from the model populated through the controller. The page gets geared up.
Q43. What Are The Advantages Of Angular Js?
Advantages of Angular JS:
1.Angular JS gives functionality to create Single Page Application in a very easy and maintainable way.
2.Angular JS affords records binding functionality to HTML therefore giving consumer a rich and responsive revel in.
Three.Angular JS code is unit testable.
4.Angular JS uses dependency injection and employ separation of issues.
Five.Angular JS gives reusable additives.
6.With Angular JS, developer writes much less code and gets more functionality.
7.In Angular JS, views are pure html pages, and controllers written in JavaScript do the enterprise processing.
8.Angular JS packages can run on all predominant browsers and smart telephones which includes Android and iOS based totally phones/tablets.
Q44. On Which Types Of Component Can We Create A Custom Directive?
Angular JS presents aid to create custom directives for following sort of elements.
Element directives − Directive activates while a matching detail is encountered.
Attribute − Directive turns on whilst an identical characteristic is encountered.
CSS − Directive turns on when an identical css style is encountered.
Comment − Directive activates while an identical remark is encountered.
