Stop Hiding HttpClient Behind a Generic Angular ApiService

A wrapper that only renames get(), post(), and put() does not create architecture. It often hides it.

Dipak Ahirav

10 min read

·

Sep 17, 2026

--

1

Listen

Share

Press enter or click to view image in full size

Many enterprise Angular applications eventually create a service like this:

@Injectable({
  providedIn: 'root'
})
export class ApiService {
  private readonly http = inject(HttpClient);

get<T>(url: string, params?: unknown) {
    return this.http.get<T>(url, {
      params: params as any
    });
  }
  post<T>(
    url: string,
    body: unknown
  ) {
    return this.http.post<T>(
      url,
      body
    );
  }
  put<T>(
    url: string,
    body: unknown
  ) {
    return this.http.put<T>(
      url,
      body
    );
  }
  delete<T>(url: string) {
    return this.http.delete<T>(url);
  }
}

Not a Member? Read for FREE here.

Then every feature uses it:

this.api.get<Customer[]>(
  '/api/customers'
);

this.api.post<Order>(
  '/api/orders',
  request
);

this.api.put<Product>(
  `/api/products/${id}`,
  product
);

At first this feels clean.

No feature uses HttpClient directly.

There is one central API service.