Angular 5 - 如何使用HttpParams进行搜索/过滤

时间:2017-11-28 11:04:46

标签: node.js angular

如何正确使用HTTPParams来应用过滤器,这是它的正确用法。

用户可以按多种语言,类型和兴趣进行过滤。

component.ts

this.filterForm = this.fb.group({
        language: [],
        type: [],
        interests: [],
    })


    this.filterForm.valueChanges.subscribe((res) => {
        console.log(res);
        let filters = res;
        this.momentService.search(filters).subscribe((res) => {
            console.log(res);
        });
    });

这就是数据的样子

enter image description here

.service.ts

我将过滤器对象传递给我的服务,该服务对/ search

进行api调用
search(filters) {

    let endpoint = this.path + 'search';

    let params = new HttpParams().set('filters', filters);

    return this.apiService.get(endpoint, params);

}
  

请求   网址:http://localhost:3000/api/moment/search?filters=%7B%22language%22:%5B%22Arabic%22%5D,%22type%22:%22classmates%22,%22interests%22:%5B%22Computer%20programming%22,%22Cryptography%22%5D%7D

后端/搜索

search(req, res) {

    let search = req.query;
    console.log(search);
    return res.json(search);

    // TODO: Do search with filter objec.

 }

我的节点后端接收它,我不能对此做任何事情。我已经尝试使用JSON.Stringfy将它传递给我的后端,但是一旦它变成字符串,我就无法将结果转换回对象形式。

{ filters: '[object Object]' }

我认为我没有正确使用HTTPParms。

0 个答案:

没有答案