AngularJS
Module
AngularJS Module is container that
contains the different parts of your application like filters, controllers,
directives, services, etc. that lets you, how an application should be
bootstrapped. Any library should be specifying in the module that you want to
use.
Creating Module
You need to use module() method to create module in
AngularJS. angular.module() is function
for this.
<div ng-app="testApp">
--- code here----
</div>
<script>
var app = angular.module("testApp", []);
</script>
"testApp" is the main module and
specifies an HTML element in which the application will run. Any library should
be specify in the module that you want to use and You can also use
third-parties components as below
angular.module('testApp', [
'testApp.controllers',
'testApp.filters',
'testApp.services',
'testApp.directives',
// 3rd
party dependencies
'ui.bootstrap',
'btford.socket-io'
]);
Create Controller Module
<div ng-app="testApp">
<div ng-controller="empController">
{{message}}
</div>
</div>
<script>
var testApp = angular.module("testApp", []);
testApp.controller("empController", function ($scope) {
$scope.message = "Welcome to code-view.com";
});
</script>
Here, testApp is an object of a module while
controller() method creates a controller inside "testApp" module. So,
"myController" always will use inside "testApp" module
because it not become a global function.
Creating a Directive
AngularJS has lots of build-in directive but also
provide facility to create own directive inside the module as below
<div ng-app="testApp" ng-controller="empController">
<div>
{{message}}
</div>
<div code-view-directive></div>
</div>
<script>
var testApp = angular.module("testApp", []);
testApp.controller("empController", function ($scope) {
$scope.message = "Welcome to code-view.com";
});
testApp.directive("codeViewDirective", function () {
return {
template: "created custome directive
here!"
};
});
</script>
