Angular-导入BrowserAnimationsModule和NoopAnimationsModule，并决定在运

Question

问题是：

我只想在IE上导入NoopAnimationsModule。在我的app.module的imports数组中，我有一些类似的东西：

imports: [AppConfig.IS_IE ? NoopAnimationsModule : BrowserAnimationsModule, .... ]

这在开发过程中有效，但在生产过程中无效。我想当导入发生在代码之前时，它必须进行AOT编译到达浏览器。

我得出的结论是，我必须同时导入它们，并在运行时配置一些内容，以便决定应该使用哪个模块的提供程序。

请记住，这两个模块都提供相同的服务，但有所不同，以便更改Angular处理动画的方式。

有办法实现这个想法吗？

Answer 1

这很有趣。虽然你是对的，aot曾经用来防止这种情况，，但据我所知，对于常春藤，应该已经可以按照你的方式来做了，但我不确定。

_{刚刚测试过，你是对的，有了这样的动态值，它还不起作用}

如果你至少有角度9，你可以做以下事情：

因此，我假设在导入动画模块之前设置了AppConfig.IS_IE。看看源代码，我相信你可以通过创建一个自定义动画模块来做这样的事情。这使用了一个特殊的属性ɵinj，它不是公共API的一部分，因此它可能会更改：

@NgModule({
exports: [BrowserModule],
})
export class ConfigAnimationsModule {
static forRoot(isIE: boolean) {
return {
ngModule: ConfigAnimationsModule,
providers: isIE
? NoopAnimationsModule.ɵinj.providers
: BrowserAnimationsModule.ɵinj.providers
};
}
}

然后可以导入：

imports: [
ConfigAnimationsModule.forRoot(AppConfig.IS_IE),
//...
]

---

对于角度版本<=8您可以使用私有财产ngInjectorDef。但未经测试，因此您的里程数可能会有所不同：

@NgModule({
exports: [BrowserModule],
})
export class ConfigAnimationsModule {
static forRoot(isIE: boolean) {
return {
ngModule: ConfigAnimationsModule,
providers: isIE
? NoopAnimationsModule['ngInjectorDef'].providers
: BrowserAnimationsModule['ngInjectorDef'].providers
};
}
}