angular isolate scope's & binding returns getter function instead of value

Question

Inside isolate scope I have the following binding:

scope: {
    languages: "&",
}

The value is passed like that inside DOM:

<directive-name languages="['1', '2']">

Then when I try to access languages property scope.languages returns getter function like the one returned by the $parse service only with predefined context. So while I can easily get bound values like that

var languages = scope.languages()

I still want to make sure that this is indeed expected behavior. So should the & binding return predefined context getter function instead of actual values?

Wawy · Accepted Answer · 2014-11-22 10:55:45Z

1

Yes, that is the whole purpose of using "&".

From the angular docs:

& or &attr - provides a way to execute an expression in the context of the parent scope. If no attr name is specified then the attribute name is assumed to be the same as the local name. Given and widget definition of scope: { localFn:'&myAttr' }, then isolate scope property localFn will point to a function wrapper for the count = count + value expression. Often it's desirable to pass data from the isolated scope via an expression to the parent scope, this can be done by passing a map of local variable names and values into the expression wrapper fn. For example, if the expression is increment(amount) then we can specify the amount value by calling the localFn as localFn({amount: 22}).

More info: AngularJS Docs

However if all you want to do is pass that array to your directive all you need to do is evaluate that attribute:

In your directive:

scope.languages = scope.$eval(attrs.languages); //This should assign the array ['1', '2'] to your scope property.

answered Nov 22, 2014 at 10:55

Wawy

6,2692 gold badges26 silver badges24 bronze badges

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

7 Comments

ryeballar Over a year ago

or simply use '=' notation :)

Max Koretskyi Over a year ago

'=' will create watchers, which is redundant in my case

Wawy Over a year ago

No, '=' is two way data binding between two scope properties. From the docs again:

= or =attr - set up bi-directional binding between a local scope property and the parent scope property of name defined via the value of the attr attribute.

Max Koretskyi Over a year ago

thanks, Wawy, I'll accept your answer. This line is interesting Often it's desirable to pass data from the isolated scope via an expression to the parent scope, this can be done by passing a map of local variable names and values into the expression wrapper fn, it means that by adding watcher to the isolate scope property I can update parent's property by calling localFn({parentProperty: isolatedScopePropertyValue}). And I wonder if angular does exactly that when the = binding is used

Max Koretskyi Over a year ago

just checked out the source - no second watcher is created. Angular adds just one watcher for parent property and inside that watcher it updates either parent's scope or isolate scope's.

|

Collectives™ on Stack Overflow

angular isolate scope's & binding returns getter function instead of value

1 Answer 1

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related