Angular 2为已布线构件的空心状态设置动画

我使用component decorator的host属性声明一个动画触发器，其中包括*=>void的转换状态

我知道它会触发，因为我应用了800ms的持续时间（为了测试，我将其更改为5秒以确保），当我单击一个routerLink将其带到另一个组件时，会出现5秒的延迟

问题是，没有动画发生。它应该向左滑动并逐渐变为不透明度：0

以下是组件装饰器中的代码：

host: {
   '[@slideInOutright]': 'true',
},
animations: [ 

   trigger('slideInOutright', [

    state('*', style({transform: 'translateX(0)'})),

    transition('void => *', [
      style({transform: 'translateX(150px)', opacity:'1'}),
      animate('300ms 500ms ease-out')
    ]),
    transition('* => void', [
      animate('800ms', style({transform: 'translateX(-60px)',opacity: '0'}))
    ])
  ])

 ]

---

你应该称你的状态为

true

，而不是

*

仍然没有运气；同样的行为。哦，我想我知道这个问题。。。details.component.html被包装在一个div中，该div上有一个*ngIf=。我想有一个问题，它会忽略动画包括的任何东西。如果我在If之外添加任何内容，动画就会发生。啊。