Question

I was going through the process of creating a directive. Having gone through a few ups and downs I got through creating the directive ( widget ) and was finalizing the various attributes the directive will take.

I used the various options available like attribute, bind, evaluate, expression etc..

What I figured was that if you want to create a generic component, you can never tell how people will pass values to the the component.

Here is an illustration…

You are creating a new element component.. say

<hello name="__ARGUMENT__"></hello>

The name attribute for hello is the only variable in it. If you give it out to the public… these are the possible scenarios with which people may use this component.

case 1 :

<hello name="angular"></hello>

case 2 :

<hello name="{{name}}"></hello> 

case 3 :

<div ng-repeat="name in names">
    <hello name="name"></hello> 
</div>

Now.. for different scenarios.. I have come to understand the various options provided. I cant think of a single scenario where you would ever want the ‘attribute’ since its a simple direct substitution of values from component to the template..

In your directive definition if you had defined the name as ‘evaluate’ instead of ‘attribute’

if attribute :

<hello name="angular"></hello>

if evaluate :

<hello name="'angular'"></hello>

note the extra single quotes..

So as far as I can tell evaluate covers what attribute does.. And, using evaluate seems to be a better choice than just attribute since it covers more scenarios!

If someone can explain why attribute exists in the first place? More choices = more confusion.. 🙂

Answer 1

We are well aware of this confusion, and will be cleaning it up in the future.