在新的 Angular-Material 版本中,您需要为 Angular-Animations 添加一个模块。您可以在两个 BrowserAnimationsModule 和 NoopAnimationsModule 之间进行选择。 official guide 指出:
一些 Material 组件依赖于 Angular 动画模块,以便能够进行更高级的转换。如果您希望这些动画在您的应用程序中工作,您必须安装 @angular/animations 模块并将 BrowserAnimationsModule 包含在您的应用程序中。 npm install --save @angular/animations import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; @NgModule({ ... imports: [BrowserAnimationsModule], ... }) export class PizzaPartyAppModule { } 如果您不想在项目中添加其他依赖项,可以使用 NoopAnimationsModule。从'@angular/platform-browser/animations'导入{NoopAnimationsModule}; @NgModule({ ... 进口: [NoopAnimationsModule], ... }) 导出类 PizzaPartyAppModule { }
我不太明白这里有什么区别。似乎完全一样 :) 这两个模块有什么区别?
正如名称 noop
(“无操作”)所说,该模块不执行任何操作。它是一个模拟真实动画模块但实际上并不动画的实用模块。
这在动画太慢的平台上很方便,或者对于测试(单元、集成、与赛普拉斯的 e2e、量角器等),如果动画不涉及您实际想要测试的内容。
@NgModule({
imports: [
BrowserModule,
environment.production ? BrowserAnimationsModule : NoopAnimationsModule,
...
]
...
}
export class AppModule {}
BROWSER_ANIMATIONS_PROVIDERS
用于实际应用
将提供程序与实际模块分开,以便我们可以在 Google3 中进行本地修改以将它们包含在 BrowserModule 中。
BROWSER_NOOP_ANIMATIONS_PROVIDERS
用于测试
将提供程序与实际模块分开,以便我们可以在 Google3 中进行本地修改以将它们包含在 BrowserTestingModule 中。