Fundamental AngularJS Directives and Controllers
An AngularJS module has two sections
to it:
• A module can characterize its own
controllers, administrations, manufacturing plants, and mandates. These are
capacities and code that can be gotten to all through the module.
• The module can likewise rely upon
different modules as conditions, which are characterized at the point when the
module is instantiated. This means AngularJS will proceed to discover the
module with that specific name, and guarantee that any capacities, controllers,
administrations, and so forth characterized in that module are made accessible
to all the code characterized in this module.
This
is how we define a module named notesApp:
angular.module('notesApp',
[]);
angular.module('notesApp');
This
line of code tells AngularJS to find an existing
module named notesApp, and to
make it
accessible to utilize, include, or adjust in the present document. same module
over various records and add code to it.
![]() |
| Angular JS Development |
Creating Our First Controller:
We perceived how to make modules, yet what do we do with them? Up
until this point, they have recently been void modules. We should now
investigate controllers. Controllers in AngularJS are our workhorse, the
JavaScript capacities that perform or trigger most of our
UI-situated work. A few
of the normal obligations of a controller in an AngularJS
application include:
• Fetching the correct information from the server for the current
UI
• Deciding which parts of that information to show to the client
• Presentation rationale, for example, how to show components,
which parts of the UI to appear, step by step instructions to style them, and
so forth.
• User associations, for example, what happens when a client
clicks something or how a content information ought to be approved
An AngularJS controller is quite often straightforwardly connected
to a view or HTML. We will never have a controller that isn't utilized in the
UI (that sort of business rationale goes into administrations). It goes about
as the passage between our model, which is the information that drives our
application, and the view, which is the thing that the client sees and connects
with. So how about we investigate how we could approach making a controller for
our notesApp
![]() |
| Angular Snippet |
Module:
<html ng-app="notesApp">
<head><title>Hello AngularJS</title></head>
<body ng-controller="MainCtrl">
Hello
{{1 + 1}}nd time AngularJS
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js">
</script>
<script
type="text/javascript">
angular.module('notesApp', [])
.controller('MainCtrl', [function() {
//
Controller-specific code goes here
console.log('MainCtrl has been
created');
}]);
</script>
</body>
</html>
Dependency Injection Syntax and AngularJS
The
notation that we have used is one of the two ways in which we
can
declare AngularJS controllers (or services, directives, or filters).
The
style we have used (and will use for the remainder of the book),
which
is also the recommended way, is safe-style
of Dependency Injection,
or
declaration. We could also use:
angular.module('notesApp', [])
.controller('MainCtrl', function() {
});
and it would work similarly, but it might cause problems when we
have
a build step that minifies our code.
Now that you have understood basics of Angular JS, Check out the Angular JS internship by Surya Informatics Solutions , a trusted internship company with a network of more than 250,000 satisfied Angular JS Developers spread across globe.

