Directive code
mymodule.directive('eicon', function(){
return {
restrict: 'E',
scope: {
attr: '='
},
template: "test " + attr.name
}
});
Html
<tr ng-repeat="e in entities">
<td><eicon attr="e"></eicon></td>
</tr>
I've this error: ReferenceError: attr is not defined. What's wrong?
Since you are declaring isolated scope property attr you should be able to access scope.attr in template like this:
mymodule.directive('eicon', function(){
return {
restrict: 'E',
scope: {
attr: '='
},
template: "test {{attr.name}}"
}
});
attr is accessible in scope, so you can access scope.attr in your controller or linking phase, or {{attr}} in templates. A simple solution is to change your template to
mymodule.directive('eicon', function(){
return {
restrict: 'E',
scope: {
attr: '='
},
template: "test {{attr.name}}",
link: function (scope, element, attrs) {
console.log(scope.attr);
},
controller: function (scope) {
console.log(scope.attr);
}
}
});
