Angular9 配置 URL 參數(shù)

使用 HttpParams 類和 params 選項(xiàng)在你的 HttpRequest 中添加 URL 查詢字符串。

下面的例子中，searchHeroes() 方法用于查詢名字中包含搜索詞的英雄。

首先導(dǎo)入 HttpParams 類。

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

/* GET heroes whose name contains search term */
searchHeroes(term: string): Observable<Hero[]> {
  term = term.trim();


  // Add safe, URL encoded search parameter if there is a search term
  const options = term ?
   { params: new HttpParams().set('name', term) } : {};


  return this.http.get<Hero[]>(this.heroesUrl, options)
    .pipe(
      catchError(this.handleError<Hero[]>('searchHeroes', []))
    );
}

如果有搜索詞，代碼會用進(jìn)行過 URL 編碼的搜索參數(shù)來構(gòu)造一個(gè) options 對象。例如，如果搜索詞是 "cat"，那么 GET 請求的 URL 就是 api/heroes?name=cat。

HttpParams 是不可變對象。如果需要更新選項(xiàng)，請保留 .set() 方法的返回值。

你也可以使用 fromString 變量從查詢字符串中直接創(chuàng)建 HTTP 參數(shù)：

const params = new HttpParams({fromString: 'name=foo'});