HttpClient adding slash before query params in URL

Using angular 18 I am trying to send a GET request to my api.

export class ClinicAnalyticsService {

private routeBase : string = `${environment.apiBase}/api/analytics`

constructor(private http: HttpClient) { }

getAll = (page: number) : Observable<ClinicService> =>
this.http.get(`${environment.apiBase}/api/analytics`, {
params: new HttpParams()
.set('page', page)
.set('limit', 10)
}).pipe(
map(({data}: any) => ({
...data,
count: data.count,
analytics : data.analytics.map((clinic: any) => ({...clinic, page}))
})
)
)


I have tried adding query parameters without using HttpParams

`${this.routeBase}?page=${page}&limit=10`


I have tried adding query parameter with the HttpParams library as seen above. For some reason both outcomes produce this URL

http://127.0.0.1:5000/api/analytics/?page=1&limit=10

why is this occuring?

Continue reading...