A set of three buttons is available:
https://i.sstatic.net/5CRIF.png
By clicking the first button labeled as Request HTTP Data As Promise, you receive its HTTP response in the form of a Promise.
The second button, known as Request HTTP Data As Observable, provides its response as an Observable.
Both these buttons utilize an asynchronous response mechanism to fetch data.
Now, the focus is on the third button named Request HTTP Data and Wait, which is intended to retrieve a synchronous response. This requires waiting for the HTTP service to return the response before moving forward.
To implement this functionality, please refer to the following Stackblitz project link (and utilize the placeholder function getDataSynchronous defined within the HttpService script):
https://stackblitz.com/edit/angular-ivy-ukgwct?file=src%2Fapp%2Fhttp.service.ts
export class HttpService {
jsonFile = '../assets/products.json';
constructor(private http: HttpClient) {}
getDataAsPromise(): Promise<any> {
return this.http.get(this.jsonFile)
.toPromise()
}
getDataAsObservable(): Observable<any> {
return this.http.get(this.jsonFile)
}
getDataSynchronous(): any {
return []
}