AngularJs Directive Template with ng-transclude cannot be compiled

7
votes

I am trying to create two directives. The first directive appends other predefined angular directives (ng-click and ng-class) to the element and then compiles it so that they work.

The second directive replaces an element for a template which contains the first directive. I use ng-transclude to carry the element's contents over to the template.

The problem is that once the template from directive 2 is added the first directive tries to compile and throws a wobbly:

"TypeError: undefined is not a function"

Directive 1 works fine when ng-transclude is not present in the template. I have created a Plunk to demonstrate this: http://plnkr.co/edit/RdtjIy5XKOsqvh5VnwMr

Is anyone able to help out and point out where I am going wrong?

Thanks, Sam

1
angularjsangularjs-directive
As a rule of thumb, in order to have a clearer error during development, use the uncompressed versions of your libraries. In your case, the error is Error: $transclude is not a function in the ngTranscludeDirective. - Blackhole

1 Answers

1
votes

After further trial and error I have found a fix and as far as I can tell, there are no side-effects.

I simply remove the ng-transclude attribute from within the second directive. I have an updated Plunk here: http://plnkr.co/edit/9QXkqzzyUy9VvMYC6fO6