0

I want to create a directive which includes a ng-repeat and I need to bind an event to a contained tag inside the ng-repeat like the "test-class"

<div>
    <div ng-repeat="row in ctrl.items">
        <div>
            <p ng-bind="row.Text"></p>
            <a class="test-class"></a>
        </div>
    </div>
</div>

but my problem seems to be that in the link function the "element" property seems to contain only the ng-repeat and so I can't find the "test-class" within the element because its not there in the link function, that makes sense. But how can I then access the dom and bind some custom events to the "a" in my example.

The only solution I had is to create two directives one with the ng-repeat and the other with the content inside the ng-repeat. Do I miss something or is this the only possible solution for my problem?

Directive with name "DirectiveContent":

<div>
   <p ng-bind="row.Text"></p>
   <a class="test-class"></a>
</div>

Then the new complete Directive:

<div>
    <div ng-repeat="row in ctrl.items">
       <directive-content></directive-content>
    </div>
</div>
squadwuschel
  • 3,328
  • 3
  • 34
  • 45
  • may be help u http://stackoverflow.com/questions/35920372/how-to-use-index-of-each-item-when-item-is-written-in-directive/35920814#35920814 – Hadi J Mar 10 '16 at 18:45
  • Using `replace:true` can cause conflicts with the `ng-repeat` directive. Avoid `replace:true`. For more info see [Angular directive replace=true](http://stackoverflow.com/questions/22497706/angular-directive-replace-true) – georgeawg Mar 10 '16 at 19:02

0 Answers0