In AngularJS Application, angularJS Controller controls the application data. In this article we will try to learn how to write our first AngularJS controller. Below are new terms
This $scope object is a plain old JavaScript object. We can add and change properties on the $scope object however we see fit. This $scope object is the data model in Angular. Unlike traditional data models, which are the gatekeepers of data and are responsible for handling and manipulating the data, the $scope object is simply a connection between the view and the HTML. It’s the glue between the view and the controller.
All properties found on the $scope object are automatically accessible to the view.
First Step to Write Controller:
<div ng-app="app" ng-controller="someController">
//Some more code
</div>
<script>
var app = angular.module('app', []);
app.controller("someController", function($scope) {
//Some logic here
});
</script>
Explanation:
<!DOCTYPE html>
<html lang="en-US">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="app" ng-controller="nameController">
First Name:
<input type="text" ng-model="firstName">
<br>
Last Name:
<input type="text" ng-model="lastName">
<br>
<br>Full Name: {{firstName + " " + lastName}}
</div>
<script>
angular.module("app", []).controller("nameController", function($scope) {
$scope.firstName = "Hamidul";
$scope.lastName = "Islam";
});
</script>
</body>
</html>
By continuing to use the site, you agree to the use of cookies. more information
The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.