即使添加了polyfill，动画也无法在firefox上运行

Question

我的路由转换有这个代码：

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

function slideToTop() {
  return trigger('routerTransitionTop', [
    state('void', style({
      position: 'fixed',
      top: 0,
      bottom: 0,
      left: 0,
      width: '100%'
    })),
    state('*', style({
      position: 'fixed',
      top: 0,
      bottom: 0,
      left: 0,
      width: '100%'
    })),
    transition(':enter', [
      style({transform: 'translateY(100%)'}),
      animate('1s ease-in-out',
      style({transform: 'translateY(0%)'}))
    ]),
    transition(':leave', [
      style({transform: 'translateY(0%)'}),
      animate('1s ease-in-out',
      style({transform: 'translateY(-100%)'}))
    ])
  ]);
}

我添加了https://github.com/web-animations/web-animations-js

使用：

  

npm install web-animations-js

并将其添加到polyfills.ts：

import 'web-animations-js';

然而，转换不起作用。

如何让动画在Firefox中运行？我正在使用Angular v2。