javascript - 我可以使用 Angular2 Universal 仅在客户端中运行组件方法吗？

Question

我正在写一个 angular2 universal应用程序。它有一个 d3图表，但我希望只在客户端(浏览器)呈现 d3 图表，而不是尝试在服务器上呈现它。 angular2 universal中是否有一个接口(interface)只能在客户端运行一个组件方法？

即

class ComponentWithChart implements OnInit, ngUniversalBrowser {

  elem;

  constructor( private viewContainerRef:ViewContainerRef) {}

  ngUniversalBrowserOnInit() {

    this.elem = this.viewContainerRef.element.nativeElement;

    d3.select(this.elem).append('div').style({
      'background-color':'yellow'
    });
  }
}

是否有类似上面示例的任何东西可能允许我仅在浏览器 OnInit 中运行 ngUniversalBrowser 方法？

Answer 1

import { isBrowser } from 'angular2-universal';

isBrowser 是一个 bool 值，您可以将其导入您的组件，然后仅当它在客户端上运行时才有条件地执行代码。

if (isBrowser) {
     // this will not run on server
}