AngularJS Directive Attribute Binding and Explanations

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});

<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Capitalize input character using attribute directive in AngularJs</title>
  <script src="https://code.angularjs.org/1.4.9/angular.js"></script>
  <script>
    var app = angular.module("app", []);
    app.controller('aapCtrl', ["$scope", function($scope) {
      $scope.name = 'Anil Singh';
    }]);

    app.directive('capitalizeInputText', function() {
      return {
        require: 'ngModel',
        link: function(scope, element, attrs, capitalizeModelCtrl) {

          var capitalizeInputText = function(inputText) {
            var capitalizedValue = inputText.toUpperCase();

            if (inputText === undefined) {
              inputText = "";
            } else {
              if (capitalizedValue !== inputText) {
                capitalizeModelCtrl.$setViewValue(capitalizedValue);
                capitalizeModelCtrl.$render();
              }
            }
            return capitalizedValue;
          }

          capitalizeModelCtrl.$parsers.push(capitalizeInputText);
          capitalizeInputText(scope[attrs.ngModel]); //This is used to capitalize the initial value.
        }
      };
    });
  </script>
</head>

<body ng-app="app">
  <div ng-controller="aapCtrl">
    Input TextBox:
    <input type="text" ng-model="name" capitalize-Input-Text>
  </div>
  <div>
    <br>For More detail, go to link <a href="http://www.code-sample.com/2015/02/angularjs-auto-capitalize-input.html" target="_blank">Auto capitalize input character in textbox?</a>
  </div>
</body>

</html>

/* Put your css in here */