Angular Universal，如何将带有声明的模块与服务器端执行隔离开来

Question

我安装了ng2-pdf查看器来显示angular 6应用程序中的文档。

为了使它工作，我需要在FeatureModule中导入PdfViewerModule，我想在其中使用<ng2-pdf-viewer>组件。

问题是在PdfViewerModule中，它在函数内部调用Element和Window对象，并且在为node server.js服务时会崩溃。

目前我的模块是这样导入的：

BrowserModule > AppModule > FeatureModule > PdfViewerModule(declare <ng2-pdf-viewer>)

通常我可以通过将这样的特定模块直接导入到BrowserModule中来解决这些问题，并为ServerModule提供一些自定义创建的mock模块，该模块可能声明相同名称的<ng2-pdf-viewer>mock。我想到的解决方案是直接在BrowserModule中导入PdfViewerModule，如下所示：

BrowserModule(imports PdfViewerModule) > AppModule > FeatureModule

但在这种情况下CCD_ 10的组件不能访问其模板中的CCD_。

有没有一种方法可以将PdfViewerModule与服务器端执行隔离开来，但保留其声明？也许在这种情况下有绝对不同的方法？

提前感谢！：(

Answer 1

我认为这应该能奏效。

<ng2-pdf-viewer *ngIf="isBrowser"></ng2-pdf-viewer>
isBrowser: boolean;
constructor(@Inject(PLATFORM_ID) private platformId: string) {
this.isBrowser = isPlatformBrowser(platformId);
}

*ngIf指令应阻止PDF渲染器执行

编辑：这不起作用，因为浏览器javascript代码甚至在组件初始化(在模块声明中(之前就执行了

正如您已经想到的，您可以尝试调整此解决方案Angular中的Need BrowserAnimationsModule，但在Universal中出现错误以满足您的需要，您将有一个AppBrowserModule，它导入AppModule，再加上您将创建的另一个模块，它将包装PdfViewerModule、使用它的组件及其相关路线。