Angular 2 AoT compiler animations callback error

Question

I have Component defined like this:

@Component({
    moduleId: module.id,
    templateUrl: 'my.template.html',
    animations: [
      trigger('fadeInOut', [
        state('in', style({opacity: 1})),
        transition('void => *', [
            style({
                opacity: 0
            }),
            animate(500)
        ]),
        transition('* => void', [
            animate(500, style({
                opacity: 0
            }))
        ]),
    ])
  ]
})
export class MyComponent implements OnInit, OnDestroy {
    public stage: number = 0;
    ...
    transitionDone(transitionEvent: any): void {...}
    ...
}

And template looking like this:

<div
    *ngIf="stage"
    @fadeInOut
    (@fadeInOut.done)="transitionDone($event)"
></div>

App works fine when using JIT compilation, and done callback is fired correctly, but when i try to compile it using ngc (v. 0.6.0) it gives mi an error:

Supplied parameters do not match any signature of call target.

It's because it generates ngfactory file with wrong number of parameters for AnimationOutput :

this.registerAnimationOutput(
    this._el_0,
    new import24.AnimationOutput('fadeInOut','done'), <-- should be 3 args
    this.eventHandler(this._handle__fadeInOut_done_0_1.bind(this))
);

If I remove done callback from the template, compilation works.

I'm using Angular 2 RC.6

Answer 1

Update: It is working on angular "2.0.2"

I am having the same issue, looks there is internal bug in angular animations or AOT compiler.

You can track progress here: https://github.com/angular/angular/issues/11707