如何在 Node js 后端服务器中创建对象并将其传递给 Angular 2 前端

Question

我想在节点服务器上形成一个 javascript 对象并且例子：下面是我的 server.js 文件

中的对象

chart = {property: value, property: value, property: value}

我想在注入组件的 angular 2 服务中获取相同的对象。

请建议我怎样才能达到同样的效果？

Answer 1

使用angular的Httpclient。这是一个例子：

服务：

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class RegisterService {

  constructor(private http: HttpClient) {

  }

  register(username: string, randomPass: string, email: string): Observable<any> {
    return this.http.post('http://localhost:3000/register',
      {username: username, randomPass: randomPass, email: email})
    .catch((error: any) => Observable.throw(error.json().error || 'Server error'));
  }
}

在我们的服务中，我们注入了 HttpClient，它是 Angular 为我们提供的 AJAX 之上的抽象层。此服务使用以下代码 this.http.post 发出 post 请求。此函数有两个参数，POST 请求发送到的 URL 和 POST 请求正文中的键值对。函数 returns 一个可以在使用该函数的组件中订阅的 Observable。

注册组件（只有注册功能）：

 public register(username: string, randomPass: string, email: string) {
      this.registerService.register(username, email)
        .subscribe(myResponse => {
          if (myResponse.success) {
            this.registered = true;
        });
    }
  }

当我们想要发出 AJAX 请求时，应该调用此函数。它使用 dependency inversion principle，这样我们就可以改变服务而不必彻底改变组件。

NodeJS express 后端

我想您已经有了一个基本的 Express 应用程序运行那么这就是您需要监听 AJAX 调用并响应您要发送的对象的中间件。

app.post('register', (req, res, next) => {
   chart = {property: value, property: value, property: value}

   return res.json(chart);
});

此中间件（express 框架的一部分）侦听注册组件上的 POST 请求。然后它会发送包含图表对象值的 JSON 响应。

如果有什么不明白的地方，强烈建议你去阅读一些相关文章，尝试掌握原理。

如何在 Node js 后端服务器中创建对象并将其传递给 Angular 2 前端

How to create an object in Node js backend server and pass it to Angular 2 front end

javascript

node.js

angular

angular2-services