Angular2 $http get request to web api controller with routing 属性

Question

我有 Web Api 控制器，其路由属性应用于如下定义的方法：

[Route("api/[controller]")]
public DataController(
[HttpGet("getdata/{a:int}/{b:int}/{dateFrom:datetime}/{dateTo:datetime}")]
public IActionResult GetEvents(Int32 a, Int32 b, DateTime? dateFrom, DateTime? dateTo)
{
    if (ModelState.IsValid)
    {
            data = dataService.GetData(a,b,dateFrom, dateTo);
            return Ok(data);
        }

        return BadRequest();
    }
}

所以暴露的网络 api URL 将是： http://localhost:port/api/data/getdata/1/2/2016-10-12T00:00:00/2016-10-20T00:00:00

当我使用 Postman google chrome 扩展程序发送 GET 请求时，我可以点击这个控制器操作并且 URL 参数被正确解析。

我想使用来自 angular2 客户端的 http get 从此网站 api 获取数据：

let params: URLSearchParams = new URLSearchParams();
params.set('a', 1);
params.set('b', 2);
params.set('dateFrom', '2016-10-12T00:00:00Z');
params.set('dateTo', '2016-10-15T00:00:00Z');

    return this._http.get(this._eventsUrl, {
        search: params
    }).map((response: Response) => <ModelObject[]>response.json())
        .catch(this.handleError);

此调用试图从此 URL 获取数据： http://localhost:PORT/api/data/getdata?a=1&b=1&dateFrom=2016-10-12T00:00:00Z&dateTo=2016-10-15T00:00:00Z

如何将 http.get 从 angular 2 设置为使用 URL 就像在网络 api 路由中定义的那样？

Answer 1

URLSearchParams 将参数添加到 url 的搜索部分，即 '?' 之后的部分。

您需要构建一个包含整个 url 的变量，如：

const url = `${this._eventsUrl}/${a}/${b}/${dateFrom}/${dateTo}`;

注意使用反引号构造一个包含变量的字符串a, b, dateFrom, dateTo并调用this.http.get(url).map

Angular2 $http get request to web api controller with routing 属性

Angular2 $http get request to web api controller with routing attribute

asp.net-web-api-routing

angular