Example
Following example will showcase use of controller.
test.html
<html>
<head>
<title>How to sum two numbers in AngularJS</title>
</head>
<body>
<h2>How to sum two numbers in AngularJS</h2>
<div ng-app="mathApp" ng-controller="addController">
Enter first number: <input type="text" ng-model="student.firstNumber"><br><br>
Enter second number: <input type="text" ng-model="student.secondNumber"><br>
<br>
You are entering: {{student.fullName()}}
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script>
var mathApp = angular.module("mathApp", []);
mathApp.controller('addController', function($scope) {
$scope.student = {
firstNumber: "10",
secondNumber: "20",
fullName: function() {
var studentObject;
studentObject = $scope.student;
return parseInt(studentObject.firstNumber)+parseInt(studentObject.secondNumber);
}
};
});
</script>
</body>
</html>
Output
Open text.html in a web browser. See the result.
Following example will showcase use of controller.
test.html
<html>
<head>
<title>How to sum two numbers in AngularJS</title>
</head>
<body>
<h2>How to sum two numbers in AngularJS</h2>
<div ng-app="mathApp" ng-controller="addController">
Enter first number: <input type="text" ng-model="student.firstNumber"><br><br>
Enter second number: <input type="text" ng-model="student.secondNumber"><br>
<br>
You are entering: {{student.fullName()}}
</div>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script>
var mathApp = angular.module("mathApp", []);
mathApp.controller('addController', function($scope) {
$scope.student = {
firstNumber: "10",
secondNumber: "20",
fullName: function() {
var studentObject;
studentObject = $scope.student;
return parseInt(studentObject.firstNumber)+parseInt(studentObject.secondNumber);
}
};
});
</script>
</body>
</html>
Output
Open text.html in a web browser. See the result.
No comments:
Post a Comment