Angular2动画:: Easings无法按预期工作

// component.ts

import {Component,Directive,Input} from '@angular/core';
import {trigger,state,style,transition,animatE} from '@angular/core'

@Component({
    SELEctor: 'expandable',template: '<div *ngIf="isExpanded" @animate="'slide'"><ng-content></ng-content></div>',animations: [
        trigger('animate',[
            state('slide',style({ overflow: 'hidden',height: '*' })),transition('slide => void',[animate('200ms ease-out',style({ height: 0 }))]),transition('void => slide',[style({ height: 0 }),animate('200ms ease-out',style({ height: '*' }))])
        ])
    ]
})
export class SimExpandable {

    private _expanded: Boolean = false;

    @Input('expanded') set expanded(value: String | Boolean) {
        this._expanded = (value === 'true' || value === truE);
    }

    get isExpanded(): Boolean { return this._expanded }

}

该组件部分工作正常.然而,动画并不完美.我已经将组件配置为使用缓出动画,但实际上,组件是线性动画的.

我尝试过使用缓出,eaSEOut,缓出立方,eaSEOutCubic,easy-in-out,easeInOut,bounce和许多其他排列,但该组件仍然是线性动画.我真的需要为我的组件使用缓出.任何帮助将非常感激.