AngularJS Tutorial - ng-app

ng-app marks the element as the beginning of the $rootScope.

ng-app modifies the scope of directives.

$rootScope is the root of the scope chain, and all directives under the ng-app in HTML inherit from it.

We can only use ng-app once per document.

Example

In the following you can access the $rootScope via the run method:


<!doctype html>
<html ng-app="myApp">
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.3/angular.js"></script>
</head><!-- w  w  w.  j a  v  a2s  .  c  o  m-->
<body>
  {{ myProperty }}
  <button ng-click="someAction()">Click to change</button>

  <script>
    angular.module('myApp', [])
    .run(function($rootScope) {
      $rootScope.myProperty = 'A';
      $rootScope.someAction = function() {
        $rootScope.myProperty = 'B';
      };
    });
  </script>

</body>
</html>

The code above is rendered as follows: