Szukałem sposobu, aby przejść do kwerendy parametry wywołania API z nowym HttpClientModule
„s HttpClient
i jeszcze się znaleźć rozwiązanie. W starym Http
module napisałbyś coś takiego.
getNamespaceLogs(logNamespace) {
// Setup log namespace query parameter
let params = new URLSearchParams();
params.set('logNamespace', logNamespace);
this._Http.get(`${API_URL}/api/v1/data/logs`, { search: params })
}
Spowodowałoby to wywołanie interfejsu API pod następujący adres URL:
localhost:3001/api/v1/data/logs?logNamespace=somelogsnamespace
Jednak nowa HttpClient
get()
metoda nie ma search
właściwości, więc zastanawiam się, gdzie przekazać parametry zapytania?
angular
typescript
http
lodash
angular-httpclient
joshrathke
źródło
źródło
this.httpClient.get(url, { params }
Sprawdź stackoverflow.com/a/54211610/5042169Odpowiedzi:
Skończyło się na tym, że znalazłem go za pośrednictwem funkcji IntelliSense
get()
. Więc opublikuję to tutaj dla każdego, kto szuka podobnych informacji.W każdym razie składnia jest prawie identyczna, ale nieco inna. Zamiast używać
URLSearchParams()
parametrów, należy je zainicjować jako,HttpParams()
a właściwość wget()
funkcji jest teraz wywoływanaparams
zamiastsearch
.Właściwie wolę tę składnię, ponieważ jest trochę bardziej niezależna od parametrów. Zreformowałem również kod, aby był nieco bardziej skrócony.
Wiele parametrów
Najlepszym sposobem, jaki znalazłem do tej pory, jest zdefiniowanie
Params
obiektu ze wszystkimi parametrami, które chcę zdefiniować, zdefiniowanymi w ramach. Jak @estus wskazał w komentarzu poniżej, w tym pytaniu jest wiele świetnych odpowiedzi, jak przypisać wiele parametrów.Wiele parametrów z logiką warunkową
Inną rzeczą, którą często robię z wieloma parametrami, jest zezwolenie na użycie wielu parametrów bez konieczności ich obecności w każdym wywołaniu. Korzystając z Lodash, bardzo łatwo jest warunkowo dodawać / usuwać parametry z wywołań interfejsu API. Dokładne funkcje używane w Lodash, Underscores lub vanilla JS mogą się różnić w zależności od aplikacji, ale zauważyłem, że sprawdzanie definicji właściwości działa całkiem dobrze. Poniższa funkcja przekazuje tylko parametry, które mają odpowiednie właściwości w obrębie zmiennej parametrów przekazanej do funkcji.
źródło
let params = new HttpParams(); params.set(...)
nie będzie działać zgodnie z oczekiwaniami. Zobacz stackoverflow.com/questions/45459532/…new HttpParams({fromObject: { param1: 'value1', ... }});
jest to najłatwiejsze podejście (kątowe 5+)params.set(...)
.Możesz (w wersji 5+) użyć parametrów konstruktora fromObject i fromString podczas tworzenia HttpParamaters, aby trochę ułatwić
lub:
źródło
const params = {'key': 'value'}
do:http.get('/get/url', { params: params })
Możesz to przekazać w ten sposób
źródło
params
Bardziej zwięzłe rozwiązanie:
źródło
W Angular 7 udało mi się go uruchomić, używając następujących elementów bez użycia HttpParams.
źródło
Jeśli masz obiekt, który można przekształcić w
{key: 'stringValue'}
pary, możesz użyć tego skrótu, aby go przekonwertować:Po prostu uwielbiam składnię spreadów!
źródło
joshrathke ma rację.
W dokumentach angular.io jest napisane, że URLSearchParams z @ angular / http jest przestarzałe . Zamiast tego powinieneś użyć HttpParams z @ angular / common / http . Kod jest dość podobny i identyczny z tym, co napisał joshrathke. Dla wielu parametrów, które są zapisywane na przykład w obiekcie takim jak
możesz też zrobić
Jeśli potrzebujesz dziedziczonych właściwości, usuń odpowiednio hasOwnProperty.
źródło
właściwość search typu URLSearchParams w klasie RequestOptions jest przestarzała w wersji kątowej 4. Zamiast tego należy używać właściwości params typu URLSearchParams .
źródło