HTTP calls using a reusable function (TS, Angular 5/6)

data.service.ts

import { Component, Injectable } from '@angular/core';
import * as urljoin from 'url-join';
import { environment } from '../environments/environment';
import { HttpClient, HttpHeaders, HttpResponse } from '@angular/common/http';
import { Router } from '@angular/router';


@Injectable()
export class DataProvider {
  apiUrl: string;

  constructor (
    private http: HttpClient,
    private router: Router
  ) {
    this.apiUrl = environment.path;
  }

  requestPost = (endpoint: any, data: any) => {
    const body = JSON.stringify(data);
    return this.http.post( urljoin( this.apiUrl, endpoint ), body, { } )
    .toPromise()
    .then((response: Response) => response)
    .catch(error => error);
  }

  requestGet = (endpoint: any, data: any) => {
    return this.http.get( urljoin( this.apiUrl, endpoint ), { })
    .toPromise()
    .then((response: Response) => response)
    .catch(error => error);
  }

}

file.component.ts

getData () {
  this.dataProvider.requestGet(`enpoint?x=${this.x}&limit25`, {})
  .then(
    data => {
     // Using lodash to improve performance and reduce HTTP calls to remote server
      this.results = unionBy(data.results, 'field');
      sessionStorage.setItem('x', JSON.stringify(data['results']) );
      this.total = filter( data.counts,  [ 'x',  'field'] )[0].count;
    },
    err => {
      console.log(err)
      sessionStorage.setItem('x', '');
    });
  }