Edit in JSFiddle

angular.module('scopeExample', [])
  .controller('GreetController', ['$scope', '$rootScope', function($scope, $rootScope) {
    $scope.name = 'World';
    $rootScope.department = 'Angular';
  }])
  .controller('ListController', ['$scope', function($scope) {
    $scope.names = ['Igor', 'Misko', 'Vojta'];
  }]);
<div ng-app='scopeExample'>
    <div class="show-scope-demo">
        <div ng-controller="GreetController">
          Hello {{name}}!
        </div>
        <div ng-controller="ListController">
          <ol>
            <li ng-repeat="name in names">{{name}} from {{department}}</li>
          </ol>
        </div>
    </div>
</div>
.show-scope-demo {
    font-family: 'arial';
}
.show-scope-demo.ng-scope, .show-scope-demo .ng-scope {
    border: 1px solid #6a8;
    margin: 4px 2px;
}