Using ngRepeat and ngClass on same element in directive template causes error

[JasonRodman]

I have a directive that turns a collection of items into a variable number of columns. The template for the directive uses ngRepeat to repeat the columns, and ngClass to apply a css class that turns the div into a column. The problem is angular throws errors when using the ng-class on same line as ng-repeat. On a suggestion from stack overflow I changed it to just use class="{{expression}}" and it still causes the very same error. Removing the ngClass or the class=""{{expression}}" fixes the issue, but the directive doesn't work properly since I cannot find another way to apply a class to a repeated element that is supplied by the model or scope. Now, this same functionality works fine in normal angular views, but not when used in a directive template. I also tried template vs templateUrl and both behave the exact same way.

Here is a plunkr i put together to demonstrate:
http://plnkr.co/edit/MKAbQR?p=preview

[JasonRodman]

Has anyone had a chance to take a look at this?

[thomashilzendegen]

As far as I understand this is not how ng-transclude should work/be used. This is described further in this issue (#7874).

What you want to archive is an item template defined from the "outside" but repeated for the inner ngRepeat using the childScope of ngRepeat instead of the outside scope where the directive is used. You have to do this with another directive which explicitly uses the scope of the ngRepeat during the transclusion.

Here is a working example: http://plnkr.co/edit/bCk8xpipnJNwgzd477wk?p=preview

Maybe this should be closed as works as expected.

#ngEurope