HTML

return observable from function angular

1. Better practise is to use Observable:

import { catchError } from 'rxjs/operators';
import { throwError } from 'rxjs';

bbb() {
 return this.http.get(this.url)
   .pipe(
     catchError(err => {
       console.log('err', err);
       return throwError('Something bad happened; please try again later.');
     });
}

2. And, then simply just subscribe to bbb:

import { Subscription } from 'rxjs';

testSubscription: Subscription;

ngAfterContentInit() {
    this.testSubscription = this.bbb()
      .subscribe(son => {
        console.log('son', son); // here you get the result
      });
}

3. Don't forget to unsubscribe:

ngOnDestroy() {
  this.testSubscription.unsubscribe();
}

display observable in html angular

 
<!--.html file-  use '|async' pipe -->
<ul class=""  scope="row" *ngFor="let aboutus of this.pageData |async " >             
		<li>{{aboutus.key}} {{aboutus.data.details}} </li>                               
 </ul>

what is observable in angular

Observable in Angular is a feature that provides support 
for delivering messages between different parts of your single-page application.
This feature is frequently used in Angular because it is responsible 
for handling multiple values, asynchronous programming in Javascript, 
  and also event handling processes.