Lottie-web: loopComplete EventListener not triggering

[srsiddz]

I'm trying to set up a fairly simple series of events. When a button is clicked, the onClick method is executed. It plays an animation one time, then as soon as the animation is done playing I want the helper method to be called.

The animation is playing, but the helper method is never called.

Below I've provided a few snippets of my helper method and the onclick method.

helper (bool: boolean): void {
console.log('Helper!');
if (bool) {
// do something
} else {
// do something else
}
}

onClick(event): void {
this.animOn.play();
this.animOn.addEventListener('loopComplete', function() { this.helper(true); });
}

[bodymovin]

Are you setting loop to true when loading the animation?
If not, the loopComplete event won't fire. You'll need to use the "complete" event.

[srsiddz]

That's exactly what it was. Thank you.

Is there any documentation you'd recommend to programmers just learning this?

[bodymovin]

No, I have to work on it.
The README file is the best there is right now.

[bronze]

im trying to hide the modal where the animation appears after its ended.
can anybody tell me if the onComplete is right, or if its a known issue with uikit?

    var params = {
        container: document.getElementById('lottie'),
        renderer: 'svg',
        loop: false,
        autoplay: true,
        animationData: animationData,
        onComplete: function(){ // code here
          UIkit.modal('#modal-full').hide();
        },
        onLoopComplete: function(){ // code here
          UIkit.modal('#modal-full').hide();
        }
    };

edit: dumb me copied wrongly. ctrl+c ctrl+v is hard

[bodymovin]

@bronze you should attach the handlers to the instance of the animation. Something like this:

var anim.loadAnimation(params);
anim.onComplete = function(){ // code here
  UIkit.modal('#modal-full').hide();
}
anim.onLoopComplete = function(){ // code here
  UIkit.modal('#modal-full').hide();
}

[bronze]

thank you very much! the following code worked (if anyone else ends up here)

    var params = {
        container: document.getElementById('lottie'),
        renderer: 'svg',
        loop: false,
        autoplay: true,
        path: 'data.json'
    };

    var anim;
    anim = lottie.loadAnimation(params);
    anim.onComplete = function(){ // code here
      UIkit.modal('#modal-full').hide();
      console.log("works!");
    }

note: as per previous answers be aware if you are using loop, to use onLoopComplete