javascript – 找到合成属性@enterAnimation.请在您的应用程序中包含“BrowserAnimationsModule”或“NoopAnimationsModule”. Ang

运行Karma来测试我的Angular4应用程序时,我收到此错误找到合成属性@enteranimation.请在您的应用程序中包含“browserAnimationsModule”或“NoopAnimationsModule”.虽然我已经在app.module.ts中导入了该模块

        // animation module
        import { browserAnimationsModule } from '@angular/platform-browser/animations'; 
    ...
@NgModule({
    imports: [...
        browserAnimationsModule,
        ...
      ],

在我的组件中：

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

    @Component({
      selector: 'app-about',
      animations: [
        trigger(
          'enteranimation', [
            transition(':enter', [
              style({ transform: 'translateX(100%)', opacity: 0 }),
              animate('500ms', style({ transform: 'translateX(0)', opacity: 1 }))
            ]),
            transition(':leave', [
              style({ transform: 'translateX(0)', opacity: 1 }),
              animate('500ms', style({ transform: 'translateX(100%)', opacity: 0 }))
            ])
          ]
        ),
        trigger(
          'enteranimationVetically', [
            transition(':enter', [
              style({ transform: 'translateY(100%)', opacity: 0 }),
              animate('500ms', style({ transform: 'translateY(0)', opacity: 1 }))
            ]),
            transition(':leave', [
              style({ transform: 'translateY(0)', opacity: 1 }),
              animate('500ms', style({ transform: 'translateY(100%)', opacity: 0 }))
            ])]
        )
      ],
...

该应用程序运行完美与ng服务,我得到这个错误与业力.

解决方法:

未来的读者：当你忘记放置时,你也可以得到这个确切的错误

animations: [ <yourAnimationMethod()> ]

在@Component ts文件上.

那就是你在HTML模板上使用[@yourAnimationMethod].