时间戳

首页 > 解决方案 > HTTP 查询参数

angular - HTTP 查询参数

问题描述

如果我有一个对象数组，其中存储了用户选择的所有搜索过滤器，这是它的结构：

export const filterDataObject = [{
    date: '',
    tid: '',
    className: '',
    userName: '',
    category: [],
    limit: '50',
    sort: 'acs'
}];

例如，REST 调用应该是这样的：

   http://localhost:1234/api/query? 
_filter=tid%3Dcdfg&_limit=50&_sort=asc

而 _filter 正在收集所有参数，但限制和排序

如何将结果数组作为参数传递给我的 httpClient 休息请求，尤其是类别数组？

标签： angularrestparametersangular-httpclientquery-parameters

解决方案

我在这里假设您只想将一个过滤器发送到您的 API，而不是数组，并且您正在使用 Angular 4+

选项1

this.http.get('http://localhost:1234/api/query', {params: filterDataObject[0]})...

选项#2

您可以使用HttpParams

import {HttpParams} from '@angular/common/http';
//...
let params = new HttpParams();

for(let key of Object.keys(filterDataObject[0])){
    params= params.set(key, filterDataObject[0][key]) ;
}

this.http.get('http://localhost:1234/api/query', {params: params})...

选项#3

您也可以尝试使用URLSearchParams（如果您不需要 IE 支持）。

let sp = new URLSearchParams();

for(let key of Object.keys(filterDataObject[0])){
    sp.set(key, filterDataObject[0][key]) 
}

const url = `http://localhost:1234/api/query?${sp.toString()}`;
this.http.get(url)...

推荐阅读