Nicky
Nicky

Reputation: 3817

Angular 4 - How to run animation from within Directive?

I have a pending issue on the repo here, but I figured it would be useful to ask it here anyway.

I want to trigger an animation from within a Directive programmatically. When using Renderer.animate, I get:

Renderer.animate is no longer supported!

When using Renderer.invokeElementMethod, I get:

Cannot read property 'apply' of undefined

How would I do this?

Upvotes: 4

Views: 1952

Answers (1)

Nicky
Nicky

Reputation: 3817

Changes are coming to Angular! See this GitHub issue in the official Angular repo.

TL;DR

What's really good: With the first beta of angular 4.1 (which comes out as the follow-up release to this weeks 4.0.0) you can do the following:

class MyCmp {


constructor(private _builder: AnimationBuilder) {
   }
   myMethod() {
      const animation = this._builder.build([
        style(...),
        animate(...),
        group([
          animate(...)
          animate(...)
          animate(...)
        ])
      ]);
      const player = animation.create(someElement);
      player.play();
   }
}

Upvotes: 4

Related Questions