Skip to content Skip to sidebar Skip to footer

In Which Cases Angular Directive Scope Equals Controller Scope?

I have a simple directive without scope definition: angularModule.directive('sizer', function () { return { restrict: 'EA', link: function(scope, element, attr)

Solution 1:

Directives in Angularjs has 3 scopes , as mentioned below

  • scope:false : does not create any new scopes , uses the parent scope (controller's scope) , which is by default .
  • scope:true : does create a new child scope , which prototypically inherit from the parent scope (controller's scope).
  • scope:{} : isolate scope ,which doesnt inherit from the parent scope which has bindable properties to parent's scope using '@' , '=' , '&'

refer : scopes in angualrjs

Solution 2:

When use scope true it inherit from parent while use scope empty object it make new isolated scope

angularModule.directive('sizer', function () {
    return {
      scope: true,  // use a child scope that inherits from parent   restrict: 'EA',
        link: function(scope, element, attr) {      
        }
    }
});

angularModule.directive('sizer', function () {
    return {
      scope: {},  // use a new isolated scoperestrict: 'EA',
        link: function(scope, element, attr) {      
        }
    }
});

Post a Comment for "In Which Cases Angular Directive Scope Equals Controller Scope?"