{"iq":[{"id":"1",
"q":"What Is AngularJS?",
"answer":"AngularJS is a javascript framework used for creating single web page applications.\nIt allows you to use HTML as your template language and enables you to extend HTML’s syntax to express your application’s components clearly "
},
{"id":"2",
"q":"Explain what are the key features of AngularJS ? ",
"answer":"The key features of AngularJS are\nScope\nController\nModel\nView\nServices\nData Binding\nDirectives\nFilters\nTestable"
},
{"id":"3",
"q":"Explain what is scope in AngularJS ?",
"answer":"Scope refers to the application model, it acts like glue between application controller and the view. Scopes are arranged in hierarchical structure and impersonate the DOM ( Document Object Model) structure of the application. It can watch expressions and propagate events."
},
{"id":"4",
"q":"Explain what is services in AngularJS ?",
"answer":"Intially it was developed by Misko Hevery and Adam Abrons. Currently it is being developed by Google."
},
{"id":"5",
"q":"Who created Angular JS ? ",
"answer":"It is difficult to unit test UI with webforms, where views in mvc can be very easily unit tested."
},
{"id":"6",
"q":"Explain what is the difference between AngularJS and backbone.js? ",
"answer":"AngularJS combines the functionalities of most of the 3rd party libraries, it supports individual functionalities required to develop HTML5 Apps. While Backbone.js do their jobs individually. "
},
{"id":"7",
"q":"Mention what are the advantages of using Angular.js framework ?",
"answer":"Advantages of using Angular.js as framework are\nSupports two way data-binding\nSupports MVC pattern\nSupport static template and angular template\nCan add custom directive\nSupports REST full services\nSupports form validations\nSupport both client and server communication\nSupport dependency injection\nApplying Animations\nEvent Handlers "
},
{"id":"8",
"q":"What is ng-app .?",
"answer":"In angular, ng-app is called a directive. There are many directives in angular.\nThe ng prefix in the directive stands for angular. The ng-app directive is a starting point of AngularJS Application.\nAngular framework will first check for ng-app directive in an HTML page after the entire page is loaded.\nIf ng-app directive is found, angular bootstraps itself and starts to manage the section of the page that has the ng-app directive. "
},
{"id":"9",
"q":"where to place the ng-app directive on the page ",
"answer":"It should be placed at the root of the HTML document, that is at the <html> tag level or at the <body> tag level, so that angular can control the entire page."
},
{"id":"10",
"q":"What is a module in AngularJS",
"answer":"A module is a container for different parts of your application i.e controllers, services, directives, filters, etc."
},
{"id":"11",
"q":"Why is a module required",
"answer":"Modules are the angular application's equivalent of the Main() method. Modules declaratively specify how the angular application should be bootstrapped."
},
{"id":"12",
"q":"How to create a module",
"answer":"Use the angular object's module() method to create a module. The angular object is provided by angular script. The following example, creates a module.\nvar myApp = angular.module(\"myModule\", [])"
},
{"id":"13",
"q":"What is a controller in angular",
"answer":"In angular a controller is a JavaScript function. The job of the controller is to build a model for the view to display. The model is the data."
},
{"id":"14",
"q":"How to create a controller in angular",
"answer":"create a JavaScript function and assign it to a variable\nvar myController = function ($scope) {\n$scope.message = \"hello all\";\n}"
},
{"id":"15",
"q":"What is $scope",
"answer":"$scope is a parameter that is passed to the controller function by angular framework. We attach the model to the $scope object, which will then be available in the view. "
},
{"id":"16",
"q":"How to register the controller with the module",
"answer":"Use module object's controller function to register the controller with the module\nmyApp.controller(\"myController\", myController);"
},
{"id":"17",
"q":"How to use the module that we created to bootstrap the angular application",
"answer":"Associate the module name with ng-app directive\nng-app=\"myModule\"\nSimilarly associate the controller using ng-controller directive\nng-controller=\"myController\" "
},
{"id":"18",
"q":"What Are The Security Features Provided By AngularJS?",
"answer":"AngularJS provides built-in protection from the following security flaws.\nIt prevents cross-site scripting attacks: Cross-site scripting is a technique where anyone can send a request from client side and can get the confidential information easily.\nIt prevents HTML injection attacks.\nIt prevents XSRF protection for server-side communication: It can be handled by “Auth token” mechanism. When the user logins for the first time a user id and password is sent to the server and it will, in turn, return an auth token. Now, this token does the authentication in the future transactions. "
},
{"id":"19",
"q":"Explain What Are Directives? Mention Some Of The Most Commonly Used Directives In AngularJS Application? ",
"answer":"AngularJS extends the behavior of HTML and DOM elements with new attributes called Directives.\nThis AngularJS component starts with prefix “ng”.\nFollowing is the list of AngularJS built-in directives.\nng-bind – The ng-bind directive tells AngularJS to replace the content of an HTML element with the value of a given variable, or expression.If there is any change in the value of the given variable or expression, then the content of the specified HTML element will also be updated accordingly. It supports one-way binding only.\nng-model – This directive is used to bind the value of HTML controls (input, select, text area) to application data. It is responsible for binding the view into the model. Directives such as input, text area, and select require it. It supports two-way data binding.\nng-class – This directive dynamically binds one or more CSS classes to an HTML element. The value of the ng-class directive can be a string, an object, or an array.\nng-app – Just like the “Main()” function of Java language, this directive marks the beginning of the application to AngularJS’s HTML compiler ($compile). If we do not use this directive first, an error gets generated.\nng-init – This is used to initialize the application data so that we can use it in the block where it is declared. If an application requires local data like a single value or an array of values, this can be achieved using the ng-init directive.\nng-repeat – This repeats a set of HTML statements for the defined number of times. The set of HTML statements will be repeated once per item in a collection. This collection must be an array or an object."
},
{"id":"20",
"q":" What Are Expressions In AngularJS?",
"answer":"AngularJS binds data to HTML using Expressions. It can be written inside double braces: {{ expression}} or inside a directive as ng-bind=”expression”. AngularJS solves the expression and returns the result exactly where that expression is written.\nAngularJS expressions are much like JavaScript expressions. They can include literals, operators, and variables.\nFor example –\n{{ 2 + 2 }} (numbers)\n{{Name + \" \" + email}} (string)\n{{ Country.Name }} (object)\n{{ fact[4] }} (array) "
},
{"id":"21",
"q":"What Are Filters?",
"answer":"An AngularJS Filter changes or transforms the data before passing it to the view. These Filters work in combination with AngularJS expressions or directives. AngularJS uses pipe character (“|”) to add filters to the expressions or directives. For example:\n<p> {{ bid | currency }} </p> "
},
{"id":"22",
"q":"Explain Different Filters Provided By AngularJS?",
"answer":"AngularJS provides following filters to transform data.\ncurrency – It is used to format a number to a currency format.\ndate – It is required to format a date to a specified format.\nfilter – It chooses a subset of items from an array.\njson – It formats an object to a JSON string.\nlimitTo – Its purpose is to create an array or string containing a specified number of elements/characters. The elements are selected, either from the beginning or the end of the source array or string. This depends on the value and sign (positive or negative) of the limit.\nlowercase – This filter converts a string to lower case.\nnumber – It formats a number as a text.\norderBy – It enables to sort an array. By default, sorting of strings happens alphabetically. And sorting of numbers is done numerically. It also supports a comparator function where we can define what will be counted as a match or not.\nuppercase – This filter converts a string to upper case.; "
},
{"id":"23",
"q":"What Are Angular Prefixes $ And $$?",
"answer":"To prevent accidental name collisions within the code, AngularJS prefixes the names of public objects with $ and the names of private objects with $$.\nUse of these literals ($ or $$) for any other reason is not recommended."
},{"id":"24",
"q":"What Are Different Ways To Invoke A Directive? ",
"answer":"There are four different ways to invoke a directive in an angular application. They are as follows.\n1) As an attribute:\n<span my-directive></span>\n2) As a class:\n<span class=\"my-directive: expression;\"></span>\n3) As an element:\n<my-directive></my-directive>\n4) As a comment:\n<!-- directive: my-directive expression -->"
},
{"id":"25",
"q":"What Is The Difference Between One-Way Binding And Two-Way Binding? ",
"answer":"The main difference between one-way binding and two-way binding is as follows.\nIn one-way binding, the scope variable in the HTML gets initialized with the first value its model specifies.\nIn two-way binding, the scope variable will change its value whenever the model gets a different value."
},{"id":"26",
"q":"What Is Singleton Pattern? How Does Angular Use It?",
"answer":"A singleton pattern is an approach that we adopt to limit the instantiation of a Class to have only one object. In Angular, the dependency injection and the services implement the singleton pattern."
},{"id":"27",
"q":"What Is $Scope In AngularJS?",
"answer":"It is an application object. And behaves as the owner of the apps variables and functions. Scope object has access to both View and controller. Thus it works as a medium of communication between both of them. This object contains both data and functions. We can use it to access model data of the controller."
},{"id":"28",
"q":"What Is Single Page Application In AngularJS? ",
"answer":"Single-Page Applications are web applications that fit on a single HTML page. It dynamically updates the web page as the user performs actions on the app.\nSPAs use AJAX and HTML to create quick and responsive web apps. A single page load extracts all the web app code (JS, HTML, CSS).\nThus the user navigates to different parts of the application quickly as it happens without refreshing the whole page."
},{"id":"29",
"q":"What is ng-app, ng-init and ng-model? ",
"answer":"ng-app : Initializes application.\nng-model : Binds HTML controls to application data.\nng-Controller : Attaches a controller class to view.\nng-repeat : Bind repeated data HTML elements. Its like a for loop.\nng-if : Bind HTML elements with condition.\nng-show : Used to show the HTML elements.\nng-hide : Used to hide the HTML elements.\nng-class : Used to assign CSS class.\nng-src : Used to pass the URL image etc."
},{"id":"30",
"q":"Is AngularJS compatible with all browsers? ",
"answer":"Yes AngularJS is compatible with the following browsers: Safari, Chrome, Firefox, Opera 15, IE9 and mobile browsers (Android, Chrome Mobile, iOS Safari)."
},{"id":"31",
"q":"What is bootstrapping in AngularJS?",
"answer":"Bootstrapping in AngularJS is nothing but initializing, or starting the Angular app. AngularJS supports automatic and manual bootstrapping.\nAutomatic Bootstrapping: this is done by adding ng-app directive to the root of the application, typically on the tag or tag if you want angular to bootstrap your application automatically. When angularJS finds ng-app directive, it loads the module associated with it and then compiles the DOM.\nManual Bootstrapping: Manual bootstrapping provides you more control on how and when to initialize your angular App. It is useful where you want to perform any other operation before Angular wakes up and compile the page."
},{"id":"32",
"q":"Can we have nested controllers in AngularJS?",
"answer":"Yes, we can create nested controllers in AngularJS. Nested controllers are defined in hierarchical manner while using in View. "
},{"id":"33",
"q":"What is $rootscope in AngularJS?",
"answer":"Every application has a single root scope. All other scopes are descendant scopes of the root scope. Scopes provide separation between the model and the view, via a mechanism for watching the model for changes. They also provide event emission/broadcast and subscription facility. "
},{"id":"34",
"q":"On which types of component can we create a custom directive?",
"answer":"AngularJS provides support to create custom directives for the following:\nElement directives − Directive activates when a matching element is encountered.\nAttribute − Directive activates when a matching attribute is encountered.\nCSS − Directive activates when a matching css style is encountered.\nComment − Directive activates when a matching comment is encountered. "
},{"id":"35",
"q":"What is internationalization and how to implement it in AngularJS?",
"answer":"Internationalization is a way in which you can show locale specific information on a website. AngularJS supports inbuilt internationalization for three types of filters: currency, date and numbers. To implement internalization, we only need to incorporate corresponding js according to locale of the country. By default it handles the locale of the browser."
},{"id":"36",
"q":"Can AngularJS have multiple ng-app directives in a single page?",
"answer":"No. Only one AngularJS application can be auto-bootstrapped per HTML document. The first ngApp found in the document will be used to define the root element to auto-bootstrap as an application. If another ng-app directive has been placed then it will not be processed by AngularJS and we will need to manually bootstrap the second app, instead of using second ng-app directive."
},{"id":"37",
"q":"Does Angular use the jQuery library?",
"answer":"View and multiview are container controls. Multiview control: It can contain collection of view controls but not a normal control.\n\nView Control: It can contain normal controls, but view control should be placed within the multiview. \nBy implementing view and multiview control we can reduce the no. of pages. "
},{"id":"38",
"q":"What are the config files we have in asp.net?",
"answer":"Yes, Angular can use jQuery if it’s present in the app when the application is being bootstrapped. If jQuery is not present in the script path, Angular falls back to its own implementation of the subset of jQuery that we call jQLite."
},{"id":"39",
"q":"What is ng-app, ng-init and ng-model?",
"answer":"ng-app : Initializes application.\nng-model : Binds HTML controls to application data.\nng-Controller : Attaches a controller class to view.\nng-repeat : Bind repeated data HTML elements. Its like a for loop.\nng-if : Bind HTML elements with condition.\nng-show : Used to show the HTML elements.\nng-hide : Used to hide the HTML elements.\nng-class : Used to assign CSS class.\nng-src : Used to pass the URL image etc."
},{"id":"40",
"q":"Explain what is injector in AngularJS? ",
"answer":"An injector is a service locator, used to retrieve object instance as defined by provider, instantiate types, invoke methods, and load modules."
},{"id":"41",
"q":"What is the difference between AngularJS and backbone.js? ",
"answer":"AngularJS combines the functionalities of most third party libraries and supports individual functionalities required to develop HTML5 Apps. While Backbone.js does these jobs individually."
},{"id":"42",
"q":"What is the difference between link and compile in Angular.js? ",
"answer":"Compile function is used for template DOM Manipulation and to collect all the directives.\nLink function is used for registering DOM listeners as well as instance DOM manipulation and is executed once the template has been cloned."
},{"id":"43",
"q":"How can digest cycle time be decreased?",
"answer":"Digest cycle time can be decreased by decreasing the number of watchers. To do this you can:\nUse web worker\nWork in batches\nCache DOM\nRemove unnecessary watchers\nUse one-time Angular binding"
},{"id":"44",
"q":"What are the benefits of dependency injection?",
"answer": "Dependency injection has two major benefits: Testing and decoupling. "
}
]
}