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”

Here is the list of cons of AngularJS

    • JavaScript support mandatory

Just be imagine, the devices that access your server but they are disabled for JavaScript. So the users are unable to access into your web apps or website. In the case of a great number of users, AngularJS based web is not so efficient. In spite of this, it is good for plain HTML-based web.

    • Greenness with Model View Controller (MVC)

If you are a developer and wants to do some traditional with almost zilch knowledge of MVC then you are not advised to use the Angular.JS because it will be time-consuming for you. You should hire an expert who has good knowledge of MVC if you are short in time to submit the project

    • The dilemma scopes

If you are fresh in Angular.JS then it will be difficult for you to deal with complex entities such as Quite layered and hierarchically and scopes. Debugging the scope is a believed a very hard task for many programmers.

    • Other difficult features

There are several features of Angular.JS like directives, dependency injection and factories which are hard to use. So, you have to spend a lot of time on it to understand all of them or prefer to hire an expert.

    • Time consumption in old devices

The browser on old computer and mobile are failed or take a little more time to render pages of application and websites designed using the framework. It happens because the browser begins to complete some supplementary tasks like DOM manipulation. But this quibble does not seem in the new devices.

    • Difficult to learn

It is very hard to accustom to the framework. Plus, you may get some additional problems like limited documentation. But Angular.JS continuously make it easier

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.

It is a scope that exists separately with no prototypal inheritance. It makes the components reusable and permits to control the binding either one-way or two-way.

Routing is one the core feature of AngularJs Framework that is useful in building a single page web application with multiple views. In Angular ngRoute Module is used to implement Routing. ngView,$routeProvider,$route and $routeParams are different components of the ngRoute Module that helps to configure and mapping Url to views.

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

In order to disable the right click event in AngularJS, you need to add the disable-right-click as the element’s attribute. Simply use preventDefault(), this cancels the event and stops further propagation of the event.

Below are some major browsers supported by Angular js

  • Mozilla Firefox
  • Google Chrome
  • Microsft Edge
  • IE 10,11
  • IE Mobile,
  • Safari, iOS
  • Android: Nougat (7.0) Marshmallow (6.0)

In Angular JS $rootscope and $scope both are an object which is used for sharing data from the controller to view.
The main difference between $rootscope and $scope is that $rootscope is available globally to across all the controllers whereas $scope is available only in controllers that have created it along with its children controllers.

In angular Directives are used to extend the attributes of Html elements.
Creating custom directive in Angular js.
Angular js Directives are restricted to element and attribute and created using a directive function.Here is sample code to create a directive in Angular js.


var app = angular.module("myApp", []);
app.controller('AppController', function($scope) {
    var users=[];
    var user1={};
    user1.firstName="Satyam";
    user1.lastName="Kumar";
    users.push(user1);
    var user2={};
    user2.firstName="Ravi";
    user2.lastName="Sankar";
    user2.push(user2);
    $scope.users=students;
});
app.directive('user', function() {
    //define the directive object
    var directive = {};
    //restrict = E, implies that directive is Element directive
    directive.restrict = 'E';
    //element will be replaced by this text/html
    directive.template = "First Name: {{user.firstName}} , Last Name: {{user.lastName}}";
    var linkFunction = function($scope, element, attributes) {
        element.css("background-color", "#e1e1e1");
    }
    directive.link=linkFunction;
    return directive;
});

As Above directive is restricted to Element directive, so you can use this directive as an element only.
Usage:


<div ng-app="app">
 <h1>Custom Directive Demo</h1>
 <div ng-controller="UserController">
 <div ng-repeat="user in users">
 <user></user>
 </div>
 </div>
</div>

The caching is implemented by using a cache object that stores and retrieves data and is primarily used by $templaterequest and script directive to cache the templates.

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.

The controller is a function which generally takes an empty scope object as a parameter and adds to it the fields and functions that will be later exposed to the user via the view.

Compile – It compiles an HTML DOM into a template and produces a template function that is used to link scope and template together. It is executed only once.

Pre-link – It is executed before the child elements are linked.

Post-link – It is executed after the child elements are linked.