Directive definition syntax clarification

Question

If I declare the following isolate scope in a directive definition:

scope: {
    state: '=', 
},

Is it accurate to say the = links the state property on the isolate scope to the value of returned by the expression associated with an attribute named state on the directive declaration, run in the parent scope?

The documentation puts it this way: "localModel (=state) will reflect the value of parentModel (=state) on the parent scope". Parentheses added by me. — a better oliver
– a better oliver, Commented Oct 1, 2015 at 9:33

Kalhan · Accepted Answer · 2015-10-01 09:44:31Z

1

For example say your directive is like below,

<div ng-controller="testCtrl">
    <directive-name state="scope_variable"></directive-name>
</div>

then if we use like this

scope: {
    state: '=', 
},

state attribute on the directive should be a $scope (testCtrl's) variable, If its a scope variable then state is pointing to same variable in the testCtrl's scope.

or a expression for ex like ...state="'scope_variable'"... then it's a String and it's not pointing to a scope variable, and also if you defined it as ...state="1+2"... then its a expression so that state variable inside directive scope is equals to 3.

hope this make sense.

here is a demo.

note

if we define the directive as isolated scope scope: {} then angular will create a child scope from its immediate parent, (parent scope of the previous example is scope of testCtrl).

see the console of the provided demo and see the console.log(scope.$parent.name); is pointing to the $scope.name of MainCtrl's scope.

edited Oct 1, 2015 at 9:44

answered Oct 1, 2015 at 9:23

Kalhan

21.9k8 gold badges71 silver badges96 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Ben Aston Over a year ago

Yes, that makes, sense, but can you confirm that my description in the question is correct? Specifically that the expression is evaluated in the parent scope.

Kalhan Over a year ago

i update the answer, please check it. :), what they refering to parent scope is the scope of testCtrl in the example.

Ben Aston Over a year ago

So, if my understanding of your answer is correct, then my statement in the question was correct?

Kalhan Over a year ago

I have added a simple demo

Collectives™ on Stack Overflow

Directive definition syntax clarification

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related