AngularJS Descriptive Questions for exam (part-2)

1. What is AngularJS?

Answer: AngularJS is an open-source JavaScript framework developed by Google. It helps you to create single-page applications or one-page web applications that only require HTML, CSS, and JavaScript on the client side. It is based on MV-* pattern and allow you to build well structured, easily testable, and maintainable front-end applications.

2. What are Directives in AngularJS?

Answer: AngularJS directives are a combination of AngularJS template markups (HTML attributes or elements, or CSS classes) and supporting JavaScript code. The JavaScript directive code defines the template data and behaviors of the HTML elements.

AngularJS directives are used to extend the HTML vocabulary i.e. they decorate html elements with new behaviors and help to manipulate html elements attributes in interesting way.

There are some built-in directives provided by AngularJS like as ng-app, ng-controller, ng-repeat, ng-model etc.

3. How AngularJS expressions are different from the JavaScript expressions?

Answer: AngularJS expressions are much like JavaScript expressions but they are different from JavaScript expressions in the following ways:

1. Angular expressions can be added inside the HTML templates.

2. Angular expressions doesn't support control flow statements (conditionals, loops, or exceptions).

3. Angular expressions support filters to format data before displaying it.

4. What are Expressions in AngularJS?

Answer: AngularJS expressions are much like JavaScript expressions, placed inside HTML templates by using double braces such as: {{expression}}. AngularJS evaluates expressions and then dynamically adds the result to a web page. Like JavaScript expressions, they can contain literals, operators, and variables.

There are some valid AngularJS expressions:

- {{ 1 + 2 }}

- {{ x + y }}

- {{ x == y }}

- {{ x = 2 }}

- {{ user.Id }}

5. What are Filters in AngularJS?

Answer: Filters are used to format data before displaying it to the user. They can be used in view templates, controllers, services and directives. There are some built-in filters provided by AngularJS like as Currency, Date, Number, OrderBy, Lowercase, Uppercase etc. You can also create your own filters.

Filter Syntax

{{ expression | filter}}

Filter Example

1.    <scripttype="text/javascript">

2.    {{14| currency }}//returns $14.00

3.    </script>

6. What is Angular Prefixes $ and $$?

Answer: To prevent accidental name collisions with your code, Angular prefixes names of public objects with $ and names of private objects with $$. So, do not use the $ or $$ prefix in your code.

7. What is Global API?

Answer: Global API provides you global functions to perform common JavaScript tasks such as comparing objects, deep copying, iterating through objects, and converting JSON data etc. All global functions can be accessed by using the angular object. The list of global functions is given below:

angular.lowercase - Converts the specified string to lowercase.

angular.uppercase - Converts the specified string to uppercase.

angular.forEach - Invokes the iterator function once for each item in obj collection, which can be either an object or an array.

angular.isUndefined - Determines if a reference is undefined.

angular.isDefined - Determines if a reference is defined.

angular.isObject - Determines if a reference is an Object.

angular.isString - Determines if a reference is a String.

angular.isNumber - Determines if a reference is a Number.

angular.isDate - Determines if a value is a date.

angular.isArray - Determines if a reference is an Array.

angular.isFunction - Determines if a reference is a Function.

angular.isElement - Determines if a reference is a DOM element (or wrapped jQuery element).

angular.copy - Creates a deep copy of source, which should be an object or an array.

angular.equals - Determines if two objects or two values are equivalent. Supports value types, regular expressions, arrays and objects.

angular.bind - Returns a function which calls function fn bound to self

angular.toJson - Serializes input into a JSON-formatted string. Properties with leading $$ characters will be stripped since angular uses this notation internally.

angular.fromJson - Deserializes a JSON string.

angular.bootstrap - Use this function to manually start up angular application.

angular.reloadWithDebugInfo - Use this function to reload the current application with debug information turned on.

angular.injector - Creates an injector object that can be used for retrieving services as well as for dependency injection

angular.element - Wraps a raw DOM element or HTML string as a jQuery element.

angular.module - Used for creating, registering and retrieving Angular modules.

8. When dependent modules of a module are loaded?

Answer: A module might have dependencies on other modules. The dependent modules are loaded by angular before the requiring module is loaded.

In other words the configuration blocks of the dependent modules execute before the configuration blocks of the requiring module. The same is true for the run blocks. Each module can only be loaded once, even if multiple other modules require it.

9. How angular modules load the dependencies?

Answer: An angular module use configuration and run blocks to inject dependencies (like providers, services and constants) which get applied to the angular app during the bootstrap process.

10. What is core module in AngularJS?

Answer: ng is the core module in angular. This module is loaded by default when an angular app is started. This module provides the essential components for your angular app like directives, services/factories, filters, global APIs and testing components.

11. What components can be defined within AngularJS modules?

Answer: You can define following components with in your angular module:

1. Directive

2. Filter

3. Controller

4. Factory

5. Service

6. Provider

7. Value

8. Config settings and Routes

12. What is the size of angular.js file?

Answer: The size of the compressed and minified file is < 36KB.

13. What browsers AngularJS support?

Answer: The latest version of AngularJS 1.3 support Safari, Chrome, Firefox, Opera 15+, IE9+ and mobile browsers (Android, Chrome Mobile, iOS Safari, Opera Mobile).

AngularJS 1.3 has dropped support for IE8 but AngularJS 1.2 will continue to support IE8.

14. Is AngularJS a library, framework, plugin or a browser extension?

Answer: AngularJS is a first class JavaScript framework which allows you to build well structured, easily testable, and maintainable front-end applications. It is not a library since library provides you limited functionality or has dependencies to other libraries.

It is not a plugin or browser extension since it is based on JavaScript and compatible with both desktop and mobile browsers.

15. How to use jQuery with AngularJS?

Answer: By default AngularJS use jQLite which is the subset of jQuery. If you want to use jQuery then simply load the jQuery library before loading the AngularJS. By doing so, Angular will skip jQLite and will started to use jQuery library.

16. Does AngularJS has dependency on jQuery?

Answer: AngularJS has no dependency on jQuery library. But it can be used with jQuery library.

17. How AngularJS is different from other JavaScript Framework?

Answer: Today, AngularJS is the most popular and dominant JavaScript framework for professional web development. It is well suited for small, large and any sized web app and web application.

AngularJS is different from other JavaScript framework in following ways:

1. AngularJS mark-up lives in the DOM.

2. AngularJS uses plain old JavaScript objects (POJO).

3. AngularJS is leverages with Dependency Injection.

18. What are the advantages of AngularJS?

Answer: There are following advantages of AngularJS:

- Data Binding - AngularJS provides a powerful data binding mechanism to bind data to HTML elements by using scope.

- Customize & Extensible - AngularJS is customized and extensible as per you requirement. You can create your own custom components like directives, services etc.

-Code Reusability - AngularJS allows you to write code which can be reused. For example custom directive which you can reuse.

- Support – AngularJS is mature community to help you. It has widely support over the internet. Also, AngularJS is supported by Google which gives it an advantage.

- Compatibility - AngularJS is based on JavaScript which makes it easier to integrate with any other JavaScript library and runnable on browsers like IE, Opera, FF, Safari, Chrome etc.

- Testing - AngularJS is designed to be testable so that you can test your AngularJS app components as easy as possible. It has dependency injection at its core, which makes it easy to test.

19. Why to use AngularJS?

Answer: There are following reasons to choose AngularJS as a web development framework:

1. It is based on MVC pattern which helps you to organize your web apps or web application properly.

2. It extends HTML by attaching directives to your HTML markup with new attributes or tags and expressions in order to define very powerful templates.

3. It also allows you to create your own directives, making reusable components that fill your needs and abstract your DOM manipulation logic.

4. It supports two-way data binding i.e. connects your HTML (views) to your JavaScript objects (models) seamlessly. In this way any change in model will update the view and vice versa without any DOM manipulation or event handling.

5. It encapsulates the behaviour of your application in controllers which are instantiated with the help of dependency injection.

6. It supports services that can be injected into your controllers to use some utility code to fulfil your need. For example, it provides $http service to communicate with REST service.

7. It supports dependency injection which helps you to test your angular app code very easily.

8. Also, AngularJS is mature community to help you. It has widely support over the internet.

1. What are different ways to invoke a directive?

Answer: As an attribute

<span my-directive></span>

As a class

<span class="my-directive: expression;"></span>

As an element

<my-directive></my-directive>

As a comment

<!-- directive: my-directive expression -->

Share on Google Plus

About blackcat

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.