简单地加上.. import {BrowserAnimationsModule} from '@angular/platform-browser/animations';

协和进口:( … BrowserAnimationsModule

],

在app.module.ts文件中。

确保您已经安装。NPM install @angular/animations@latest

对我来说是因为我把动画名放在方括号里。

<div [@animation]></div>

但在我拆除支架后，一切都正常工作:

<div @animation></div>

针对angularJS 4的更新:

(SystemJS) XHR错误(404 Not Found)加载http://localhost:3000/node_modules/@angular/platform-browser/bundles/platform-browser.umd.js/animations

解决方案:

**cli:** (command/terminal)
npm install @angular/animations@latest --save

**systemjs.config.js** (edit file)
'@angular/animations': 'npm:@angular/animations/bundles/animations.umd.js',
'@angular/animations/browser': 'npm:@angular/animations/bundles/animations-browser.umd.js',
'@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',

**app.module.ts** (edit file)
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@NgModule({
  imports:      [ BrowserModule,BrowserAnimationsModule ],
...

--
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
---

@NgModule({
  declarations: [   --   ],
  imports: [BrowserAnimationsModule],
  providers: [],
  bootstrap: []
})

确保@angular/animations包已经安装(例如，通过运行npm install @angular/animations)。然后，在app.module.ts中

import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

@NgModule({
  ...,
  imports: [
    ...,
    BrowserAnimationsModule
  ],
  ...
})

我的问题是@angular/platform-browser的版本是2.3.1

npm install @angular/platform-browser@latest --save

升级到4.4.6，在node_modules/@angular/platform-browser下添加了/animations文件夹