使用Angular将查询参数发送到控制器的不同解决方案

Question

我有一个Spring控制器，它接受一个参数 - Pageable：

 @RequestMapping(value = "/all", method = RequestMethod.GET)
    public Page<Item> getAll(Pageable pageable) {    
        return itemService.findAll(pageable);
    }

通过Postman我可以通过提供api作为query params来调用此http://localhost:8080/api/item/all?page=0&size=2，我收到了json个回复，其中包含两个元素。

如何在Angular 4中调用此类api？还有其他方法可以在query params中发送Angular 4吗？

getItems(page, size){
    return this.http.get(this.url + '/all?page=' + page + '&size=' + size);
  }

我想使用类似的东西：

ngOnInit() {
    let search = new URLSearchParams();
    search.set('page', '0');
    search.set('size', "2");
    console.log('------------', search);
    this.itemService.getItems({search:search})
      .subscribe(res => {
        console.log('teitems', res.json());
        this.items = res.json().content;
      });
  }

但通常它根本不起作用，搜索对象看起来很可疑，因为事实如下：

我的浏览器请求的network标签中的内容如下：

因为您看到request URL与我在Postman上面发布的内容不同。

Answer 1

你的问题很像here。 看看那里的答案。

总结：

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

params = params.append('var1', val1);

this.http.get('base_url', {params: params});

您也可以手动构建您的param对象（不使用HttpParams）。

this.http.get('base_url', {params: {'var1': val1}});