javascript - How to run this angular $interval function just three times (3 loops) -

i run following function controller, using interval , producing 3 different avatars in view template.

at moment, produces 1 avatar.png , love produce 3 different.

so how can set html displays 3 different images? here code:

controller:

$scope.capture = function(){     var canvas = document.getelementbyid('canvas');     var video = document.getelementbyid('video');     canvas.getcontext('2d').drawimage(video, 0, 0, video.videowidth, video.videoheight); }  $interval (function(){     $scope.capture(); }, 1500); 

and template canvas image drawn:

<canvas id="canvas"></canvas>  

so basically, want after 1.5 seconds image drawn , total images drawn should 3. each image it's own canvas id different.

why don't use $timeout

for(var i=0;i<3;i++) {     $timeout (function(){         $scope.capture();     }, 1500*i); } 

this execute function 3 times. may need write logic draw image in different canvas different ids.