如何使用查询参数路由渲染 angular4 通用答案

【问题标题】：How to render angular4 universal with query parameter route如何使用查询参数路由渲染 angular4 通用
【发布时间】：2017-08-22 12:19:12
【问题描述】：

出于 SEO 目的，我正在尝试将 angular 1.4 迁移到 angular4 通用。一切正常。我只有一条路线。

注册后确认邮箱 http://localhost/confirmEmail/09393?code='xxxxxxxxx'

ngOnInit() {

    let param_id = this.route.snapshot.params['id'];
    let param_code = this.route.snapshot.queryParams['code'];
    this.message = '';

    this.authService.getConfirmation(param_id, param_code)
        .subscribe(
            data => {
              this.router.navigate(['/login']);
            },
            error => {

            }
        );
  }

看起来它在服务器上呈现并调用了rest API getConfirmation。
一旦在客户端呈现 UI，它就会再次调用 getconfirmation。

有没有办法。我不想调用其余的 API 服务器端，只是从客户端代码中调用它。

【问题讨论】：

标签： angular webpack universal

【解决方案1】：

这对我有用。

检查是否存在全局窗口对象。然后调用rest api得到确认

ngOnInit() {

  if (typeof window !== 'undefined') {
      let param_id = this.route.snapshot.params['id'];
      let param_code = this.route.snapshot.queryParams['code'];
      this.message = '';
      this.getConfirmation(param_id, param_code);
  }

}

【讨论】：