CodesJava

Easy learning with example program codes

Angularjs add controller to module tutorial


AngularJS controller:

AngularJS controllers are used to control the data and flow of AngularJS applications. The ng-controller directive is used to define the AngularJS controller.

AngularJS module:

An AngularJS module defines an application and used to separate logics like services, controllers and application etc. It acts as a container for the different parts of an application.

Example Explanation:

First include the AngularJS library in the application. The ng-app directive initializes the application. We create a module named app and then add a controller appCtrl to it. Refer this controller with ng-controller directive in module.

Note: We can also add multiple controllers to a module. Click here to see multiple controllers example.

Output:

Example:

<!DOCTYPE html>
<html>
<script 
 src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js">
</script>
<body>
 
<div ng-app="testApp" ng-controller="appCtrl">
{{ firstName + " " + lastName }}
</div>
 
<script>
var app = angular.module("testApp", []);
app.controller("appCtrl", function($scope) {
    $scope.firstName = "Vishal";
    $scope.lastName = "Gupta";
});
</script>
 
</body>
</html>

Try it:

JS Bin on jsbin.com



Industrial Training

We offers Placement Oriented Training on Java, Spring, JSF, Hibernate, PHP, AngularJS, Angular 4, PLSQL, Oracle BI Publisher etc. We also provides Online training, please mail us at hr@codesjava.com.

Development

We also provides the Development services for Website Development , Java Development, PHP Development, Android App Development etc. You can contact us on hr@codesjava.com.

Copyright © 2019 CodesJava DMCA.com Protection Status SiteMap Reference: Java Wiki