在项目更改时运行Angular2动画

Question

我有以下代码：

<item-detail [item]="selectedItem"[@flyInOut]="'in'"></item-detail>

每当selectedItem发生变化时，我想在项目之间进行平滑过渡。

我决定从文档中尝试这个：

animations: [
  trigger('flyInOut', [
    state('in', style({transform: 'translateX(0)'})),
    transition('void => *', [
      style({transform: 'translateX(-100%)'}),
      animate(100)
    ]),
    transition('* => void', [
      animate(100, style({transform: 'translateX(100%)'}))
    ])
  ])
]

但不幸的是，动画不会触发，看起来项目没有从视图中删除（无效），而只是更改。

有没有办法将动画设置为在项目更改时触发？