TryIt Editor v2.0 - Example of a parent scope | JS

Source Code: (back to article)

<!DOCTYPE html>
<html>
 <head>
   <title>www.w3docs.com</title>
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.6/angular.min.js"></script>
   <script>
      angular.module('test',[])
      .controller('testCtrl',function($scope){
            console.log($scope,'ctrl')
      })
         .directive('myTest',function(){
            return {
               restrict: 'EA',
               scope: false,
               compile: function(){
                  return function(scope){
                     console.log(scope,'directive');
                   }
           }
            }
         })
.directive('myIsolateTest',function(){
            return {
               restrict: 'EA',
               scope: true,
               compile: function(){
                  return function(scope){
                     console.log(scope,'directive');
                   }
           }
            }
         })
   </script>
 </head>
 <body>
   <div ng-app="test">
     <div ng-controller="testCtrl">
inherit parent scope
       <div my-test>scope id: {{$id}}</div>
       <div my-test>scope id: {{$id}}</div>
       <div my-test>scope id: {{$id}}</div>
<hr>
has own scope
       <div my-isolate-test>scope id: {{$id}}</div>
       <div my-isolate-test>scope id: {{$id}}</div>
       <div my-isolate-test>scope id: {{$id}}</div>
     </div>
   </div>
 </body>
</html>