Wednesday, September 6, 2017

When dependent modules of a module are loaded?

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.

What is difference between config() and run() method in AngularJS?

Configuration block – This block is executed during the provider registration and configuration phase. Only providers and constants can be injected into configuration blocks. This block is used to inject module wise configuration settings to prevent accidental instantiation of services before they have been fully configured. This block is created using config() method.

angular.module('myModule', []).
config(function (injectables) { // provider-injector

// This is an example of config block.
// You can have as many of these as you want.

// You can only inject Providers (not instances)

// into config blocks.
}).

run(function (injectables) { // instance-injector
// This is an example of a run block.
// You can have as many of these as you want.
// You can only inject instances (not Providers)

// into run blocks

});

Run block – This block is executed after the configuration block. It is used to inject instances and constants. This block is created using run() method. This method is like as main method in C or C++.

The run block is a great place to put event handlers that need to be executed at the root level for the application.

For example, authentication handlers.

How angular modules load the dependencies?

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.

What is core module in AngularJS?

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.

What components can be defined within AngularJS modules?

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

What are Modules in AngularJS?

AngularJS modules are containers just like namespace in C#. They divide an angular app into small, reusable and functional components which can be integrated with other angular app. Each module is identified by a unique name and can be dependent on other modules. In AngularJS, every web page (view) can have a single module assigned to it via ng-app directive.

Creating an AngularJS module

<script type="text/javascript">


// defining module angular.module('myApp', []);


//OR defining module which has dependency on other modules angular.module('myApp', ['dependentModule1', 'dependentModule2']);

</script>

Using an AngularJS module into your app

You can bootstrap your app by using your AngularJS module as given below:


<html ng-app="myApp">
<head>

...
</head>
<body>

...
</body>

How AngularJS handle the security?

AngularJS provide following built-in protection from basic security holes:

1. Prevent HTML injection attacks.

2. Prevent Cross-Site-Scripting (CSS) attacks.

3. Prevent XSRF protection for server side communication.

Also, AngularJS is designed to be compatible with other security measures like Content Security Policy (CSP), HTTPS (SSL/TLS) and server-side authentication and authorization that greatly reduce the possible attacks.

What are AngularJS features?

The features of AngularJS are listed below:

1. Modules

2. Directives

3. Templates

4. Scope

5. Expressions

6. Data Binding

7. MVC (Model, View & Controller)

8. Validations

9. Filters

10. Services

11. Routing

12. Dependency Injection

13. Testing

What is the size of angular.js file?

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

What browsers AngularJS support?

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.

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

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.

What is restrict option in directive?

The restrict option in angular directive, is used to specify how a directive will be invoked in your angular app i.e. as an attribute, class...