Skip to main content

AngularJS Modules Explained

AngularJs Modules.

A module in AngularJS can be thought of as packages in Java. It’s the container for the different parts of an application – controllers, services, filters, directives, etc. AngularJS can group together certain functionalities/Javascript under a single module.
  • A module can define it’s own controllers, services, filter, directives, etc which will be accessible throughout the module.
  • A module can depend on other modules.
  • A module can be used by AngularJS to bootstrap an application. By passing the module name to ng-app directive, we can tell AngularJS to load this module as the main entry point for the application.
  • In angularJS, a module is defined or called using angular.module function.
    Define a Module with no dependencies
    angular.module('myapp', []);
    The first argument is the module name, ‘myApp’. The second argument is an array of module names that this module depends on. Empty square brackets denotes that this module does not have any dependencies.

Load an existing Module
If we just want to load an existing module defined elsewhere, call module function with only one parameter which is name of module.
angular.module('myApp');
Let’s take a simple example:
<html ng-app="myApp">
<head><title>Modle example</title></head>
<body>
 2 + 2 = {{2 + 2}}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.4/angular.js">
</script>
<script>
angular.module('myApp', []);
</script>
</body>
</html>
Above example defines a module. AngularJS then bootstraps the application using this module through the ng-app directive.
Till now, we have just created empty modules. There is nothing inside them. We will add functionality to them in next posts.
Labels:

Comments

Post a Comment

Popular posts from this blog

Yahoo! Calendar "Add Event" Seed URL Parameters

I can't seem to find any official documentation on this, so here are my notes. Some information gathered from  http://richmarr.wordpress.com/tag/calendar/ Other information gathered through trial and error, and close examination of the "Add Event" form on Yahoo!'s site. Yahoo! Calendar URL Parameters Parameter Required Example Value Notes v Required 60 Must be  60 . Possibly a version number? TITLE Required Event title Line feeds will appear in the confirmation screen, but will not be saved. May not contain HTML. ST Required 20090514T180000Z Event start time in UTC. Will be converted to the user's time zone. 20090514T180000 Event start time in user's local time 20090514 Event start time for an all day event. DUR value is ignored if this form is used. DUR 0200 Duration of the event. Format is HHMM, zero-padded. MM may range up to 99, and is converted into hours appropriately. HH values over 24 hours appear to be modulated by 24. Durations t...
1 comment
Read more

HTML5 30-Day Course Outline

  🗓️ Week 1: HTML5 Fundamentals and Structure 🎯 Goal: Understand the structure of HTML5 and core elements. Day 1: Introduction to HTML5 ✅ Concepts What is HTML5 and its role in web development <!DOCTYPE html> declaration Basic HTML structure ( <html> , <head> , <body> ) Character encoding ( UTF-8 ) ✅ Example Code html <!DOCTYPE html > < html lang = "en" > < head > < meta charset = "UTF-8" > < title >My First HTML5 Page </ title > </ head > < body > < h1 >Hello World! </ h1 > </ body > </ html > ✅ Task: 👉 Create a basic HTML page with a title and h1 element. Day 2: HTML Elements and Semantics ✅ Concepts Block vs Inline Elements <div> , <span> , <article> , <section> , <aside> , <main> , <footer> Importance of semantic HTML for SEO ✅ Example Code html < article > < header > ...
Post a Comment
Read more

Java KeyWords

Java Keywords Some identifiers are reserved in Java which has separate functionality and meaning such type of reserved identifiers are called reserved words. Java has 54 reserved keywords. We can divide them into the following categories. Primitive types and void : 9 keywords boolean : creates a boolean variable. The only possible values are true and false and the default value is false. byte : creates a byte variable. A byte takes 8-bits and ranges from -128 to 127. char : used to create a character variable. It takes 2-bytes and it’s unsigned. The value ranges from 0 to 65,536. short : create a short variable of 2-bytes. The value ranges from -32,768 to 32,767. int : create an integer variable, takes 4-bytes and the range is from -2,147,483,648 to 2,147,483,647 long : creates a long variable, takes 8-bytes and the range is from -9,223,372,036,854,775,808 to 9,223,372,036,854,775,807. float : creates a signed floating point variable using 4-bytes. double ...
Post a Comment
Read more