AngularJS Module: Everything in your AngularJS app is contained inside of a module. They are used to hold onto controllers and other relevant codes about our application. Placing code inside of different modules protects the code from being considered “global” in scope, giving you more control over your app’s functioning.
A module represents components in an application. It is a type of container the application controllers. The name given to a module helps you to reference scopes, directives, and other components of the application. Named modules a very useful for the packaging and reuse of an application’s various elements. The ng-app directive assigns every web page and view or to a specific module.
AngularJS Module Example
<div ng-app="example App"</div> <script> var app angular.module(myApp.[]); </script>
AngularJS Module with Controller
Now we will add a controller to our application, by referring to the controller with the ng-controller directive.
Angular JS Module with Controller Directive Example
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js"></script>
</head>
<body ng-app="example App">
<h1>AngularJS Module Demo: </h1>
<div ng-controller="exampleCtrl">
{{firstName+ " " +lastName}}
</div>
<script>
var myApp = angular.module("example App", []);
myApp.controller("exampleCtrl", function ($scope) {
$scope.firstName = "eBook";
$scope.lastName = "Reader";
});
</script>
</body>
</html>
Angular JS Module with Controller Example Output
