客户端异步。请求与服务器端渲染

问题描述：

我以为我会试用一点与SEO使用Angular4/Node.js，但已经来过一个挑战。客户端异步。请求与服务器端渲染

Angular Universal使我有可能做服务器端渲染，所以我可以让我的元关键字，标题，图像网址等注入到HTML之前，我的网页浏览器 - 很棒！现在的挑战是，在某些时候，我希望至少能够在客户端异步执行一些东西，例如。获取一些JSON数据，甚至捕获一个Angular click事件。

我似乎无法做到这样的东西，而使用下面的例子。

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 
    }); 
    } 
}

有什么没有办法像这样使用通用的服务器端渲染时将有可能？你们会如何执行此操作？

干杯！

答

我真的不知道你是什么意图，但我认为这可能是其中之一：

你想要做一些东西，当用户点击服务器端渲染按钮角接管之前？那么你正在寻找Preboot。
您想在服务器端呈现期间从服务器获取数据，然后在客户端使用这些数据？那么你可能正在寻找TransferState再水化API。
您的应用程序出现问题，它根本没有响应按钮点击。即使使用SSR，点击仍然可以使用。检查控制台是否有错误。

3.是正确的答案:)。我的软件包未包含在应用程序中，并且未产生任何错误。感谢你说它应该按照预期工作，那是什么使我朝着正确的方向发展。 – iMe

客户端异步。请求与服务器端渲染

相关推荐