Articles → ANGULAR.JS → Controllers in angular.js

Controllers in angular.js








Syntax


var app = angular.module('app_name', []);
app.controller('controller_name', function($scope) {});









Example




<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
	<title></title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
	<script type="text/javascript">
	var app = angular.module('app', []);
	app.controller('myController', function($scope) {
		$scope.Name = "gyan";
		$scope.Age = 6;
		$scope.URLMethod = function() {
			return "gyansangrah.com"
		}
	});
	</script>
</head>

<body>
	<form id="form1" runat="server">
		<div ng-app="app" ng-controller="myController"> Name: {{Name}}
			<br /> Age:
			<input type="text" ng-model="Age" />
			<br /> URL: {{URLMethod()}} </div>
	</form>
</body>

</html>





Click to Enlarge











<html xmlns="http://www.w3.org/1999/xhtml">

<head runat="server">
	<title></title>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
	<script type="text/javascript">
	var app = angular.module('app', []);
	app.controller('myController', function($scope) {
		$scope.Name = '';
		$scope.Country = '';
		$scope.SetData = function() {
			$scope.Name = "Karan";
			$scope.Country = "India";
		}
	});
	</script>
</head>

<body>
	<form id="form1" runat="server">
		<div ng-controller="myController" ng-app="app"> My Name is : {{Name}}
			<br /> My Country is : {{Country}}
			<input type="button" value="Set" ng-click="SetData()" /> </div>
	</form>
</body>

</html>





Click to Enlarge


Posted By  -  Karan Gupta
 
Posted On  -  Friday, June 12, 2015

Query/Feedback


Your Email Id  
 
Subject 
 
Query/FeedbackCharacters remaining 250