One way data binding in AngularJS

How to implement one way data binding in AngularJS

One way data binding in AngularJS means binding data from Model to View.


    <script>
        var app = angular.module('app', []);
        app.controller('myController', function($scope) {
            $scope.FullName = 'Sheo Narayan';
            $scope.Address = 'Hyderabad, India';
        });
    </script>
    
    <body ng-app="app" ng-controller="myController">
    <h2>One way data binding - AngularJS</h2>    
    <p>Full Name: {{ FullName }} </p>
    <p>Address: <span ng-bind="Address"></span></p>

In above code snippet, we have FullName and Address representing the model value. When the page loads, these values are set in the data binding placehoders (here first data binding placeholder is {{ FullName}} and second data binding placeholder is ng-bind attribute.

Here the data is bounded only one way ie. from Model to View.

Output

Angular JS one way binding