AngularJS Controller

AngularJS Scopes

To control the flow of data AngularJS mainly relies on controllers. It is defined using ng-controller directive. Controller contain attributes, properties and functions.

Example of Controller:

<title>AngularJS Controllers</title>
<script src=""></script>
<h2>AngularJS Controllers</h2>
<div ng-app="ngApp" ng-controller="nameController">
    First name: <input type="text" ng-model="name.firstName"><br><br>
    Last name: <input type="text" ng-model="name.lastName"><br>
    Full name: {{name.fullName()}}
var ngApp = angular.module("ngApp", []);
ngApp.controller('nameController', function($scope) {
   $ = {
      firstName: "Mark",
      lastName: "Taylor",
      fullName: function() {
         var nameObject;
         nameObject = $;
         return nameObject.firstName + " " + nameObject.lastName;
  • nameController defined with $scope as argument.
  • $scope refers to the application which is to use the nameController object.
  • $ is property of nameController object.
  • $ object has two properties: firstName and lastName.
  • $ object has fullName function which return the concatenate name.
  • When you type anything in first name and last name input boxes, Full name will be updated automatically.

For any types of queries, you can contact us on

You may like:  Ajax call - AngularJS

Leave a Reply

Your email address will not be published. Required fields are marked *