Angular services for the entity

The ProductService is an Angular service that interacts with our REST endpoints and created in product.service.ts:

@Injectable()
export class ProductService {

    private resourceUrl = SERVER_API_URL + 'api/products';

    constructor(private http: HttpClient) { }

    ...

    query(req?: any): Observable<HttpResponse<Product[]>> {
        const options = createRequestOption(req);
        return this.http.get<Product[]>(
            this.resourceUrl, 
            { params: options, observe: 'response' }
        )
        .map((res: HttpResponse<Product[]>) => this.convertArrayResponse(res));
    }

    ...
}

As you can see, the service has a constructor with dependencies injected following a similar pattern as our server-side code. There are methods mapping all the CRUD actions to the backend REST Resource. The HTTP calls make use of RxJS Observables to provide an asynchronous streaming API, which is much better than a Promise based API. 

There is also ProductPopupService defined in product-popup.service.ts, a utility service to open popup dialogs for entity editing and deletion.