未從服務器端預渲染定義JavascriptServices窗口

Question

我正在將angular2 +與javascriptservices模板一起使用，並且試圖找到一種將庫導入到嘗試訪問window的 組件中的解決方案。 Javascript服務使用服務器端預渲染，因此您無法將庫導入立即嘗試訪問窗口而未獲取窗口未定義錯誤的組件中。

當前，我正在嘗試將dat.gui添加到我的組件中，但是我沒有找到解決方案。 https://www.npmjs.com/package/dat.gui

有人知道我可以在客戶端加載dat.gui庫並將其傳遞給我的組件以避免將其導入組件時窗口未定義錯誤的方法嗎？

由於服務器端預渲染，將其添加到我的組件時始終會引發錯誤。

const dat = require('dat.gui');
const gui = new dat.GUI();

或從'dat.gui'導入*作為dat；

Answer 1

這就是我用來確保它是使用窗口，文檔，導航器，jQuery操作的瀏覽器的方式。

  import {PLATFORM_ID} from '@angular/core'
  import {isPlatformBrowser } from '@angular/common'
    ....


    constructor(@Inject(PLATFORM_ID) private platformId: Object){}

    private isBrowser: boolean = isPlatformBrowser(this.platformId);

    ngAfterViewInit(){
      if (this.isBrowser) {
       const dat = require('dat.gui');
       const gui = new dat.GUI();
      }
    }