What are Angular JS modules? – A Simple Demo

By | July 15, 2017

Angular JS modules means :

  • An AngularJS module defines an application.
  • The module is a container for the different parts of an application like controller, services, filters, directives etc.
  • The module is a container for the application controllers.
  • Controllers always belong to a module.

Angular JS Modules

Example

Here we have a module named “MyApp” and controller for this module is “MyController”.
“MyApp” specifies an HTML element in which the application will run.

[html]
<html>

<head>
<title>Angular JS Controller</title>
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
</head>

<body>
<h2>AngularJS Module Demo</h2>

<div ng-app="MyApp" ng-controller="MyController">

{{ firstName + " " + lastName }}

</div>

<script>

var app = angular.module("MyApp", []);
app.controller("MyController", function($scope){
$scope.firstName = "Coderz";
$scope.lastName = "Heaven";
}
// You can write other functions below

function demoFunction1(){
alert("This is a Demo Function")
}

demoFunction1()

);

</script>

</body>
</html>
[/html]

Note

You cannot write multiple controllers in one html page. Only the first one will work.

Leave a Reply

Your email address will not be published. Required fields are marked *