如何在角度4的http请求中传递url参数答案

【问题标题】：how to pass url parameters in a http request in angular 4如何在角度4的http请求中传递url参数
【发布时间】：2018-05-09 06:48:45
【问题描述】：

如何通过传参发出get请求？我试过这个，但得到 404 错误

getOrderbyOrderNo() {

        this.orderno = this.cookie_service.get('key');

        let headers = new Headers();
        headers.append('Content-Type', 'application/json');
        headers.append('orderno', this.orderno );
        let params = new URLSearchParams();
        params.append("someParamKey", this.orderno )

        return this.http.get('http://localhost:8080/View/orders', { headers: headers, params: params })


    }

输出

ERROR 
Object { _body: "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n<meta charset=\"utf-8\">\n<title>Error</title>\n</head>\n<body>\n<pre>Cannot GET /View/orders</pre>\n</body>\n</html>\n", status: 404, ok: false, statusText: "Not Found", headers: {…}, type: 2, url: "http://localhost:8080/View/orders" }

【问题讨论】：

你使用的是httpclient还是http？
也显示您的服务器端方法...如果它工作正常，然后按照答案中给出的更改
这对你有用吗？？

标签： angular httprequest

【解决方案1】：

IMO 有两种方法可以通过 http 请求发送参数。

通过像这样将其附加到 URL -

return this.http.get('http://localhost:8080/View/orders/'+this.orderno, { headers: headers  })

另一种方法是，如果您使用的是httpclient，那么您可以在这样的选项中发送参数-
```
 let httpParams = new HttpParams()
    .set('orderno', this.orderno);
```

有关此内容的更多信息，请在此处阅读

https://www.concretepage.com/angular-2/angular-httpclient-get-example#parameters

在get 类型的请求中，请求没有正文部分，因此您必须在 URL 中附加参数，即参数或查询参数。或在选项中使用第二种方式。

【讨论】：

我知道这个答案有什么问题吗？为什么要投反对票？

【解决方案2】：

如果你使用的是httpclient，那么你应该这样做

let params = new HttpParams();
params = Params.append('firstParameter', parameters.valueOne);
params = Params.append('secondParameter', parameters.valueTwo);
return this._HttpClient.get(`${API_URL}/api/logs`, { params: params })

或者你可以创建参数对象

export interface GetParams {
  firstParameter?: string;
  secondParameter?: string;
   ..more param you want 
} 


Const getParamsobj : GetParams = {
  firstParameter: 'value',
  secondParameter: 'value'
  ..other params
}
return this._HttpClient.get(`${API_URL}/api/logs`, { params: getParamsobj })

【讨论】：

params 会在httpCall 时添加到哪里？
@PardeepJain - 没有得到你
我的意思是说你的方法和我的不一样？还是在执行后会附加 URL？
@PardeepJain - 它会将参数附加到 url，因此无需像您那样手动操作
所以基本上我们的答案是相同的，但方法不同:)

【解决方案3】：

你可以像这样传递参数：

return this.http.get('http://localhost:8080/View/orders?someParamKey=xyz&anotherParam=abc
', { headers: headers})

【讨论】：

【解决方案4】：

在HttpClient 中传递参数和标头是不同的，因为它们是不可变的，如果你想传递参数，你应该使用HttpParams。 { params: new HttpParams().set('name', term) }

【讨论】：

【解决方案5】：

试试这个：

将此包导入您的班级：

import { HttpHeaders, HttpClient, HttpParams } from '@angular/common/http';

像这样注入HttpClient：

constructor(private _http: HttpClient) {}

发送请求：

    let url = "your url";

    let Params = new HttpParams();
    Params = Params.append('param1', value1);
    Params = Params.append('param2', value2);

    let header: HttpHeaders = new HttpHeaders();
    header = header.append('Content-Type', 'text/plain');

    return this._http.get(url , { params: Params, headers: header })
        .map((response: Response) => {
        });

【讨论】：

@rina 有什么问题？为什么不接受我的回答？
参数正在传递但显示所有表格数据，它没有附加url