Anglar 中的 queryParams 与 HttpParams

Question

我现在才发现，我们可以使用“queryParams”和 HttpParams 构造查询字符串参数 URL - 下面是示例

goProducts() {
  this.router.navigate(
    ['/products'],
    { queryParams: { 'pageNumber': {page}, 'price-range': {itemsPerPage} } }
  );
}

let params = new HttpParams();
params = params.append('pageNumber', page);
params = params.append('pageSize', itemsPerPage);

哪种方法最好用？ 试图找出差异，但我无法从互联网上找出太多信息。

尝试找出差异。

Answer 1

这两种方法 - 使用 queryParams 和 HttpParams - 都可以用来构造带有查询参数的 URL。但是，这两种方法之间存在一些差异。

queryParams 方法与 Angular Router 模块一起使用来构造包含查询参数的 URL。这是构造 URL 的便捷方法，可与 RouterLink 指令或 Router 模块的导航方法一起使用。这种方法更适合 Angular 应用程序内的导航。

另一方面，HttpParams 方法用于构造可用于发出 HTTP 请求的 URL。它是 Angular HttpClient 模块的一部分。这种方法更适合向外部服务器发出 HTTP 请求。

这两种方法都有自己的优点和用例。如果您要在 Angular 应用程序中构建用于导航的 URL，则应使用 queryParams 方法。如果您要构建 URL 来向外部服务器发出 HTTP 请求，则应使用 HttpParams 方法。

在您的具体示例中，如果您要导航到 Angular 应用程序中的页面，则应使用 queryParams 方法。如果您要向外部服务器发出 HTTP 请求，则应使用 HttpParams 方法。