duycuong87vn/jsbin.show-scope.css

## jsbin.show-scope.css
.show-scope-demo.ng-scope,
.show-scope-demo .ng-scope{
  border: 1px solid red;
  margin: 3px;
}

## jsbin.show-scope.html
<!DOCTYPE html>
<html ng-app>
<head>
<meta name="description" content="[add your bin description]" />
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script>
  <meta charset="utf-8">
  <title>AngularJS review</title>
</head>
<body>
  <div class="show-scope-demo">
    <div ng-controller="greetCtrl">
      Hello {{name}} !
    </div>
    <div ng-controller="listCtrl">
      <ol>
        <li ng-repeat="name in names">{{name.name}} from {{name.department}}</li>
      </ol>
    </div>
  </div>

</body>
</html>

## jsbin.show-scope.js
function greetCtrl($scope){
  $scope.name = 'World';

}

function listCtrl($scope){
  $scope.names = [
    {'name':'Quang',
     'department':'TDH'},
    {'name':'Uoc',
     'department':'TK'},
    {'name':'TA',
     'department':'PK'}
  ];

}
	.show-scope-demo.ng-scope,
	.show-scope-demo .ng-scope{
	border: 1px solid red;
	margin: 3px;
	}
	<!DOCTYPE html>
	<html ng-app>
	<head>
	<meta name="description" content="[add your bin description]" />
	<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.14/angular.min.js"></script>
	<meta charset="utf-8">
	<title>AngularJS review</title>
	</head>
	<body>
	<div class="show-scope-demo">
	<div ng-controller="greetCtrl">
	Hello {{name}} !
	</div>
	<div ng-controller="listCtrl">
	<ol>
	<li ng-repeat="name in names">{{name.name}} from {{name.department}}</li>
	</ol>
	</div>
	</div>

	</body>
	</html>
	function greetCtrl($scope){
	$scope.name = 'World';

	}

	function listCtrl($scope){
	$scope.names = [
	{'name':'Quang',
	'department':'TDH'},
	{'name':'Uoc',
	'department':'TK'},
	{'name':'TA',
	'department':'PK'}
	];

	}