0

I need to access element (dom) with id in a jQuery function, element is inside ng-repeat of Angular (generating dynamic id for each element), and we are calling a jQuery function in element ng-bind or ng-init.

Code:

<div class="row bottom-border" ng-repeat="test in tests">
    <div class="col-xs-2 label-value">
        <div class="canvas-wrap-task">
            <canvas id="canvaspending{{$index}}" width="50" height="50"
                ng-bind="drawRequestCountCircles(test.Total, test.Pending, 'canvaspending{{$index}}','')">
            </canvas>
        </div>
    </div>
</div>

In ng-init dom is not getting prepared so the element is being returned as null in function.

And if we use ng-bind everything is working but jQuery method is called multiple times.

Please help us resolve this.

marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
Ram
  • 133
  • 3
  • 13
  • 1
    Why don't you set up a jsfiddle with an example ? It will give you more chances to be helped. – Matteo Conta Mar 12 '17 at 08:41
  • i am able to call jquery drawRequestCountCircles() method in ng-init() but canvas id is coming as 'canvaspending{{$index}}', {{$index}} value is not replacing , but when i use ng-bind() {{$index}} is replacing with value, but drawRequestCountCircles() is calling 3-4 times. – Ram Mar 12 '17 at 09:53
  • instead of calling it in ng-bind or ng-init do i need to use directive?, so that it will call after dom loads and calls juery method where we can access element. – Ram Mar 24 '17 at 07:24

0 Answers0