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

时间:2018-05-03 13:55:27

标签: javascript node.js angular angular2-services

我想在节点服务器上形成一个javascript对象 例如: 下面是我的server.js文件中的对象

{{1}}

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

请建议我如何实现同样的目标?

1 个答案:

答案 0 :(得分:0)

使用角度的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请求发送到的URL,以及POST请求正文中的键值对。该函数返回一个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表达后端

我想你已经有一个基本的快速应用程序运行,那么这是你需要监听AJAX调用并使用你想要发送的对象进行响应的中间件。

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

   return res.json(chart);
});

此中间件(快速框架的一部分)侦听寄存器组件上的POST个请求。然后它会发送一个JSON响应,其中包含图表对象的值。

如果有什么不清楚我强烈建议您尝试掌握阅读有关该主题的一些文章的原则。