如何启用Angular动画？

Question

我已经通过教程（ https://angular.io/guide/animations ）完成了所有工作，但我有错误： menu-navigation.component.html:1 ERROR Error: Found the synthetic property @slideTop. Please include either "BrowserAnimationsModule" or "NoopAnimationsModule" in your application. menu-navigation.component.html:1 ERROR Error: Found the synthetic property @slideTop. Please include either "BrowserAnimationsModule" or "NoopAnimationsModule" in your application.

我阅读了有关它的一切，但没有找到解决方法的答案。

文件：

• app.ts： https ：//gist.github.com/yakimchuk/d2458a26e0a8b9a31f7d92d15885ee08
• parent-component-html： https ： //gist.github.com/yakimchuk/63ece812957a67a243cc2ab7cb03fd0a
• parent-component-ts： https ： //gist.github.com/yakimchuk/ea857a109a5c2cc644c16d800990d469
• animated-component.ts： https ： //gist.github.com/yakimchuk/71c7f3d756742e7e6d98d26f27e889d0
• transitions.ts： https ： //gist.github.com/yakimchuk/2ef55221aaeaf382d34aee7e77d31d3d

所以我做了：

• 根模块中导入的动画模块（并将它们添加到导入部分）
• 描述动画元素的动画
• 关于动画的定义属性
• 根据文件做了一切

我试过了：

• 用NoopAnimationsModule替换BrowserAnimationsModule：没有结果
• 将“data：boolean”替换为“data：any”（在父组件中）：无结果
• 检查所有NPM模块版本：它们都是8.0.0版本，没有结果
• 多次检查教程步骤：没有结果
• 复制教程中的动画元数据并执行所有操作，但仍然：没有结果

伙计们，帮帮我:)我已经被困了几天了。

更新： 最后，我在测试一个新的空项目后找到了答案

如果您为组件（prop）定义了“动画”，那么您只能在其组件（它自己的html）中使用它们，但不能在父布局中使用它们。

而不是“”你必须在该组件内移动它的aamin（app-animated-comp）。

Answer 1

BrowserAnimationsModule是您需要在app.module中添加的软件包

https://material.angular.io/guide/getting-started

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

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