Present loading bar while hhtp post request is being handled

Hi i have the following method running in my Ionic 4 file

 register(form) {
  result => { // your result from in auth.service
    // success
  error => { // your error from observer.error() in auth.servi
    // no success
    alert('Error detected.');

And the following in my
authService.ts file

register(postData: User): Observable<any> {
return new Observable(observer => {``, postData)
      catchError(error => {
        return throwError(error); // if you catch any errors, pass them (rethrow) to the error block
       result => {; // if you receive a result, pass to register function in
         observer.complete(); // close the observable
       error => {
         observer.error(error); // if you receive an error, pass error to register function
         observer.complete(); // close the observable

These methods work perfectly but i would like to have a loading bar that appears while the HTTP request is happening and then disappear once the HTTP has succeeded or when an error is returned. I have never worked with ionic and have no idea where to put the loading bar component and how to structure it. Any help would be appreciated.

Source: New feed
Source Url Present loading bar while hhtp post request is being handled