Angular ng-repeat over 指令

Question

I've got a simple directive

directive('animalCard',function(){
    return {
        restrict:'E',
        template: '<div>time for {{a}}</div>'
    }
});

that I want to iterate over an array

$scope.animals = ['penguins','cows','turtles'];

with HTML

<div ng-repeat="a in animals">
    <animal-card>{{a}}</animal-card>
</div>

inside the curly braces for the template I'm using a as the expression to iterate over, and in this case it makes enough sense to say a in animals. But what if I wanted to use this same directive when iterating over something where the variable a wouldn't make sense? Is there a better solution to this other than using some generic interpolatable expression like {{item}} ?

Answer 1

Seems like your question is more ' What should I call my loop variable? `In the end it really doesn't matter. As long as you (or others looking at your code) understand what it's doing it's fine.

If you want it to be more semantically readable, then you will need to change the name to something generic: item , data , str , d (for data), i (as i is often used for iterations/loops.

Answer 2

You directive is literally incorrect. First of all, to insert something into directive from outside, you need transclude: true . Second, you must bind your variable a in ng-repeat="a in animals" to scope of directive, so it can understand what you want.
So working directive should look like

directive('animalCard',function(){
return {
    restrict:'E',
    transclude: true,
    scope:{
         a: '@'
    },
    template: '<div><div>time for {{a}}</div><div ng-transclude></div></div>'
    }
});

And the last thing.

<div ng-repeat="a in animals">
    <animal-card a="{{a}}">this content will be placed at the end, because of ng-tranclude attr in directive</animal-card>
</div>

Demo

Edit oh, i glanced at code and seems misunderstood point of question. But naming convention really shouldn't make sense, i usually use item . But if you want to reuse it for very different object models, you probably should use different directive with additional decoration. And yes, it will be not reusability at this point. But for same object models, it's reusable, and you shouldn't meet any problems with naming, as they are same type. imo