如何在angular-2中进行服务器api调用？

我是安格拉尔的新手。我想进行服务器调用以从我的服务器获取数据。 事实上，我知道如何在angular1.x中做到这一点，但我无法找到如何在angular-2中做到这一点

这就是我在angular1.x中尝试的方式 控制器： 服务： html

Res->{products | json}

这就是我如何构建angular1.x应用程序，使用$resource Get方法进行服务器调用。我不知道如何在angular-2中做到这一点。在angular-2中有什么方法可以做到这一点吗。请帮我做这件事好吗？

---

谢谢。

在angular2中，您可以使用Http服务，如：

// inject get instance of Http service.
http.post(API_HOST + '/prods/page/' + pageId + '/' + activeFilter', {
  'query': {
    method: 'GET',
    isArray: true,
    timeout: 20000
  }
} ).subscribe((result) => {
   // handle result
})

---

Angular中的AJAX调用是使用Http服务完成的，如下所示：

import { Http } from '@angular/http';

// ... code ...
let memberInfo;
http.get(url)
    .map(x => x.json()).
    subscribe(result => this.memberInfo = result);

---

这将执行一个异步HTTP GET调用，将返回值放入

memberInfo

变量。

要获得最佳实践，请创建一个新文件（服务）。 并按以下步骤操作

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';

@Injectable()
export class Api{

constructor(private http: Http){}
  request(){
     return this.http.get(baseUrl);
   }
}

在组件内部，您可以执行此操作

this.service.request().subscribe((res)=>{
  console.log('response',res');
},(err)=>{
 console.log(err)
}
)

---

我个人更喜欢打普通电话。在任何组件中，我都将通过传递参数来调用这个

getCall

方法

  public getCall(baseUrl:string, url:string, queryParams ?:any) {
    let _url = baseUrl + url;
    if (queryParams) {
      _url = this.appendQueryParams(_url, queryParams);
    }
    let options = new RequestOptions({
      headers: new Headers();
    });
    return this._http.get(_url, options);
  }



 public appendQueryParams(url:string, queryParams:any) {
     let queryParamString:string = "";
     _.forEach(queryParams, function (value, key) {
        queryParamString += key.trim() + "=" + value + "&";
     });
     queryParamString = queryParamString.slice(0, -1);
     queryParamString = encodeURI(queryParamString);
     url += "?" + queryParamString;
     return url;
}

在职：

  getProducts(queryParams){
    return this._callService.getCall("http://www.myproductssite.com",'/prods/page/'+pageId+'/'+activeFilter, queryParams).map(res => res.json());
  }

---

@Sakuto给了你一个很好的链接，在阅读之后，你也可以看看：更多信息：）

this.service.request().subscribe((res)=>{
  console.log('response',res');
},(err)=>{
 console.log(err)
}
)

  public getCall(baseUrl:string, url:string, queryParams ?:any) {
    let _url = baseUrl + url;
    if (queryParams) {
      _url = this.appendQueryParams(_url, queryParams);
    }
    let options = new RequestOptions({
      headers: new Headers();
    });
    return this._http.get(_url, options);
  }



 public appendQueryParams(url:string, queryParams:any) {
     let queryParamString:string = "";
     _.forEach(queryParams, function (value, key) {
        queryParamString += key.trim() + "=" + value + "&";
     });
     queryParamString = queryParamString.slice(0, -1);
     queryParamString = encodeURI(queryParamString);
     url += "?" + queryParamString;
     return url;
}

  getProducts(queryParams){
    return this._callService.getCall("http://www.myproductssite.com",'/prods/page/'+pageId+'/'+activeFilter, queryParams).map(res => res.json());
  }