CODEWITHSUNDEEP
javascriptangularjs
Sethen
Sethen

Reputation: 11348

Directive in directive template with ng-repeat and attributes

This is an interesting question and situation I find myself in. This is a little complex to explain/copy into Stack Overflow so here is a Plunker for your consideration: http://plnkr.co/edit/Zs8AXh6KZvTAqeBFFAK0

The issue

The issue is that I am trying to pass an attribute value from a one directive to another directive inside the first directives template.

If you take a look at template.html in the Plunker example you will see the problem. The example directive gets a value from ng-repeat in this case thing. thing is an attribute value on the directive in the index.html which is used in the example directive in it's isolate scope. I assumed that once it had that value it could pass it to children directives that reside in the example template. This doesn't seem to be the case as I get undefined when alerting the value.

What could be the problem

You will notice that the directives both have isolate scope which I am assuming could cause an issue somewhere.

What I've Tried

I am have tried all sorts of different combinations with =, @ and & to get this to work properly and everything was a no go. Still just got undefined each time.

I've even tried passing the value differently using curly braces and not. Each time seems not to work.

I think at one point I did attempt using $attrs.$observe and I think this worked but I felt like this was unnecessary. The Angular IRC suggested I should only be using this as a "last resort". I don't feel like I am quite there yet.

Question(s)

Why isn't this working the way I am expecting it to? Is this even a thing you should do in Angular? Am I going about this the wrong way? If so, what's the correct approach here?

Upvotes: 1

Views: 140

Answers (1)

Michael
Michael

Reputation: 3326

You misspelled the directive's attribute:

somethingelse

instead of

 somethingElse

You know that the attributes in the directives are case sensitive and you write them with a camel case notation while in the html it is case insensitive.

Here is the updated plunker: http://plnkr.co/edit/QGS9yLpggAWuBg9Ytmp7?p=preview

Upvotes: 1

Related Questions