What are Angular JS modules? – A Simple Demo

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>
   
   <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>

Note

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

Leave a Reply Cancel reply