Angularjs scope tutorial

AngularJS Scope:

AngularJS Scope is a special JavaScript object which transfers data from the controller to view and vice-versa. AngularJS Scope is represented by $scope which contains application data and methods. We can define properties and functions in $scope object inside controller.

AngularJS Scope:


Example Explanation:

First include the AngularJS library in the application. The ng-app directive initializes the application. The ng-model directive binds (two way binding) the state of the input text to the message variable. The ng-bind directive also binds the state of the input text to the message variable but using one way binding i.e. transfers data from controller to view but not vice-versa. The ng-controller=”appController” directive defines the controller. The appController defined as a JavaScript object with $scope as argument. The $scope.message property is defined and initialized in controller.


<div ng-app="testApp" ng-controller="applicationCtrl">
        <span ng-bind="message"></span> <br/>
        <input type="text" ng-model="message"/> 
var app = angular.module('testApp', []);
app.controller('applicationCtrl', function($scope) {
    $scope.message= "Hello jai!";

Try it:

JS Bin on

Comments are closed.