通过Angular与后端通信

时间:2018-02-15 10:19:39

标签: javascript ajax angular typescript web

我开发了一个小型库(js代码),我希望与angular集成。问题是这个库在某个时刻应该让请求(ajax)将一些结果推送到后端。我怎么能在角度上做到这一点?我应该开发指令来支持绑定吗? 对不起,我有小角度知识,但最好的方法是将前端收集的数据发送到后端。

感谢

1 个答案:

答案 0 :(得分:1)

与后端交互的最佳方式是使用服务。例如(该示例适用于最新的Angular版本,以前的版本不支持HttpClient,它只是Http。我还使用toPromise,它是&#39 ; s可选,如果需要,您可以处理observable

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

@Injectable()
export class YourService {
  constructor(
    private _http: HttpClient
  ) { }

  public sendDataToServer(data: any): Promise<any> {
    return this._http.post(http://fakehost/fakeurl, data)
      .toPromise()
      .catch(err => console.error(err));
  }

在你的组件内:

import { Component } from '@angular/core';
import { YourService } from '../../core/your-service.service';

@Component({
  selector: 'your-component',
  templateUrl: './your-component.component.html',
  styles: [``]
})

export class SignUpComponent {  
  constructor(private _yourService: YourService) {
    this.ApiCall();
  }

  public ApiCall(): void {
    this._yourService.sendDataToServer("any data here")
      .then(response => {
        console.log("Response:", response);
      })
      .catch(err => console.error(err));
  }
}