AngularJS Interview Questions

AngularJS Interview Questions

AngularJS is an open source model view controller MVC JavaScript framework that is used for making rich, extensible web applications. It runs on plain JavaScript and HTML, so you don't need any other dependencies to make it work.

Below are some basic facts about AngularJS that must an AngularJs Developer know before appearing in AngularJs Interview

  • Based On: MVC and MVVM design pattern. Design Patterns in programming languages are used to write reusable and maintainable code for commonly occurring problems in Software Engineering.
  • Written In: AngularJs 1.x is written in Javascript. It one of the most popular programming language on the web for creating interactive and scalable front end and server applications.
  • Supported Features: AngularJS supports features like bundling codes in modules, Dependency Injection, Routing, two-way data binding, services that help developers to write clean and reactive, user-friendly applications using Javascript.
  • Best Suited for: AngularJs is best suited for creating Single Page Applications and admin backends
  • Maintained By: It is maintained by Google Inc.
  • Licensed: Angular JS is licensed under MIT License that means anyone can modify the source code and republish it.

 

Download AngularJS Interview Questions PDF

AngularJS Interview Questions

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”

For testing AngularJS applications there are certain tools that you should use that will make testing much easier to set up and run.

Karma

Karma is a JavaScript command line tool that can be used to spawn a web server which loads your application’s source code and executes your tests. You can configure Karma to run against a number of browsers, which is useful for being confident that your application works on all browsers you need to support. Karma is executed on the command line and will display the results of your tests on the command line once they have run in the browser.

Karma is a NodeJS application and should be installed through NPM/YARN. Full installation instructions are available on the Karma website.

Jasmine

Jasmine is a behavior-driven development framework for JavaScript that has become the most popular choice for testing AngularJS applications. Jasmine provides functions to help with structuring your tests and also making assertions. As your tests grow, keeping them well structured and documented is vital, and Jasmine helps achieve this.

Jasmine comes with a number of matches that help you make a variety of assertions. You should read the Jasmine documentation to see what they are. To use Jasmine with Karma, we use the karma-jasmine test runner.

angular-mocks

AngularJS also provides the ngMock module, which provides mocking for your tests. This is used to inject and mock AngularJS services within unit tests. In addition, it is able to extend other modules so they are synchronous. Having tests synchronous keeps them much cleaner and easier to work with. One of the most useful parts of ngMock is $httpBackend, which lets us mock XHR requests in tests and return sample data instead.

Source:https://docs.angularjs.org/guide/unit-testing

AngularJS is architecture on 3 components. They are

  • The Template (View)
  • The Scope (Model)
  • The Controller (Controller)

AngularJS extends HTML attributes with Directives and binds data to HTML with Expressions.

AngularJS was designed to highlight the power of dependency injection, a software design pattern that places an emphasis on giving components of 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.

It is a routing framework for AngularJS and provides a different approach than ngRoute. It changes the application views based on the state of the application and not just the route URL

Difference between AngularJS and Angular 2

AngularJSAngular 2
Angular js or Angular 1.x is based on MVC ArchitectureAngular 2 is based on service/ components
Javascript is used to write applications in Angular js.Typescript (a superset of javascript) is used to write an application in Angular2.
A controller is used to writing logic and interact with Model and view.In Angular 2 Controllers are totally eliminated and Components take its place.
Angular 1 is created for developing Single page web-applications.In Angular 2 can be used for developing native applications for a mobile platform like React Native as well as interactive
web applications.
Angularjs is easy to set up, you just need to include the angular.js library to start.Angular 2 is dependent on other modules/ package. It gives little brainstorm to install and run Angular 2.
In Angularjs ng-app directive is used bootstrap the app.ng-app is removed in Angular 2. You need to call Angular2 bootstrap method to bootstrap your application.

Creating a service using the module's factory API is one of the most common ways to create a service. We first create an object, add properties to it and return the same object, which can later be injected into the components like service, controller, filter or directive.

In order to hide/show the div in AngularJS just get rid of display: none, the rest is in the control. If you want to hide it by default then set the value of scope.myvalue to false.

The HTML pages can be embedded within an HTML page using the ng-include directive.

Using ng-disabled attribute will help you disable element in AngularJS.

The service in AngularJS is created by registering it with the module it is going to operate in. There are three ways to create the angular service. They are:

  • Factory
  • Service
  • Provider

The AngularJS framework includes certain directives that can be used to provide the custom behavior on various DOM events. Some of the events are:

  • ng-click
  • ng-keyup
  • ng-keydown
  • ng-keypress
  • ng-dblclick
  • ng-mousedown
  • ng-mouseleave
  • ng-mouseenter
  • ng-change

The ng routing is deep linking services and directives for angular applications whereas the UI routing is a 3rd party module routing and is very powerful. It does everything an ng router does as well as has many other extra functions.

A dynamic route is a typical approach to server communication is using the HTTP server. In order to implement it, firstly write a config function that uses $http and $routeprovider to gather all information on available routes.

The different types of directives available in AngularJS are:

  • Element directives − It activates when a matching element is encountered.
  • Attribute − It activates when a matching attribute is encountered.
  • CSS − It activates when a matching CSS style is encountered.
  • Comment − It activates when a matching comment is encountered.