Question

我认为我使用Angular4 / Node.js对SEO进行了一些实验，但是遇到了挑战。

Angular Universal使我可以进行服务器端渲染，因此我可以在我的页面访问浏览器之前将我的元关键字，标题，图像URL等注入HTML中 - 太棒了！现在的挑战是，在某些时候，我希望至少能够在客户端异步地执行某些的东西，例如。获取一些JSON数据，甚至捕获Angular点击事件。

在使用下面的示例时，我似乎无法做那种事情。

home.component.ts

import { Component, OnInit } from '@angular/core';
import { Http, Response } from '@angular/http';

@Component({
  selector: 'home',
  template: `<button (click)="fetch();">Fetch some json</button>`,
  styleUrls: ['./home.component.scss']
})
export class HomeComponent implements OnInit {

  constructor(
    private _http: Http
  ) {}

  ngOnInit() {}

  public fetch(){
    console.log("Clicked");             // Does not happen

    this._http.get('./i18n/da.json')
    .subscribe((r: Response) => {
      console.debug(r.json());          // Also not happening
    });
  }
}

当使用Universal进行服务器端渲染时，是否有可能出现类似的情况？你们将如何实施这个？

干杯！

Answer 1

我不确定你的意图是什么，但我认为它可能是其中之一：

你想在Angular接管之前用户点击服务器端渲染按钮时做一些事情吗？然后你正在寻找Preboot。
您想在服务器端呈现期间从服务器获取数据，然后在客户端中使用这些数据吗？那么你可能正在寻找TransferState再水化API。
你的应用程序出了问题，根本没有按钮点击。即使使用SSR，点击也应该开箱即用。检查控制台是否有错误。

客户端异步。服务器端呈现请求

1 个答案: