Angular 2动画：路由器动画

Question

我正在尝试将路线（页面）转换添加到我的角度2应用。 在this示例之后，我能够执行动画，但只触发了离开动画。未执行输入动画，导致“下一页”立即显示。

这是每个组件的代码：

@Component({
    selector: 'home',
    template: require('./home.component.html'),
    animations: [routerTransition()],
    host: { '[@routerTransition]': '' }
})
export class HomeComponent {
}

这是动画代码，在一个单独的文件中定义：

import { trigger, state, animate, style, transition } from '@angular/core';

export function routerTransition() {
    return slideToLeft();
}

function slideToLeft() {
    return trigger('routerTransition', [
    state('void', style({ position: 'fixed', width: '100%' })),
    state('*', style({ position: 'fixed', width: '100%' })),
    transition(':enter', [
        style({ transform: 'translateX(100%)' }),
        animate('0.5s ease-in-out', style({ transform: 'translateX(0%)' }))
    ]),
    transition(':leave', [
        style({ transform: 'translateX(0%)' }),
        animate('0.5s ease-in-out', style({ transform: 'translateX(-100%)' }))
    ])
]);

}

为什么只执行离开动画？

提前致谢！ ：）