How to Call Make Angular Service Synchronous

How to call make Angular Service synchronous?

Not exactly about async broblem, you just use the this.menulist before it's assigned. Just change the way you run your codes.

ngOnInit() {
    this.menulist = localStorage.getItem('menulist');
    if (this.menulist) {
        this.sortMenuList(); // Sorting the menu if we have menulist already
    } else {
        this.SetMenuList(); // Else call the service and sort the menu then
    }
}

sortMenuList() {
    this.jsonmenulist = JSON.parse(this.menulist);
    this.jsonmenulist.sort(function (a, b) { 
      return a.mnuposno > b.mnuposno;
    });
    this.jsonmenulist = this.jsonmenulist.sort();
}

SetMenuList() {
    this._UserspecificmenuaccessService.getRMA("driver")
      .subscribe((lst) => {
        if (lst && lst.length > 0) {
          localStorage.setItem('menulist', JSON.stringify(lst));
          this.menulist = localStorage.getItem('menulist');
          this.sortMenuList(); // Sorting the menu if we have menulist already
        }
      }, (error) => {
        console.error(error)
      });
  }

By the way, SetMenuList naming should be setMenuList (Just recommended for naming).

How to make a synchronous call in angular 5?

This can be simplified by using async/await /p>

public GetCurrentUserInformation(): Promise<any>{
    return this.loginService.GetCurrentUserData().toPromise()
}

ngAfterViewInit

async ngAfterViewInit() {    
        this.responseData = await this.GetCurrentUserInformation(); // ‍♂️ 
        if (this.responseData.code != responseCodes.success) {
            this.googleInit();
        }
    }

How to make synchronous HTTP request in Angular 8 or 9 (make a request and wait)

Demo An asynchronous function is a function that operates asynchronously via the event loop, using an implicit Promise to return its result. But the syntax and structure of your code using async functions are much more like using standard synchronous functions. The await operator is used to wait for a Promise. It can only be used inside an async function.

getDataSynchronous() {
    return  this.http.get(this.jsonFile).toPromise()
}

in component

async requestDataAndWait() {
    let httpData = await this.http.getDataSynchronous();  
    this.addMessages(httpData)  
}

Synchronous call in angular 8

You really don't need the call to be synchronous, and personally that's something I would probably avoid.

The reason you're getting the console error is because you're trying to access a property on an object that hasn't been initialised yet.

template: `<h1>Todo: {{todo.title}}</h1>`

When todo is null or undefined there is no title property.

There are a few ways you could go about fixing this but the simplest way would be to check that to todo is initialised before trying to access the title property. Fortunately TypeScript has something known as a "existential operator" or "safe navigation operator" which does this for us and is as simple as changing your template to the following

template: `<h1>Todo: {{todo?.title}}</h1>`

make synchronous HTTP calls in Angular 11

const cart = [];
for(let i =0;i<3;++i) {
  cart.push(
    await this.xeService.getXeViaId("XE1700000082")
  );
}

What is the best way to make synchronous calls using Angular's HttpClient?

You could use a combination of concat, catchError and finalize to process your requests in order and stop as soon as an error occurs:

public process(batch: ProcessingDetails[]) {
  const processes = batch.map(details => this.httpClient.post(`${this.baseUrl}`, batchDetails).pipe(
    map(() => {
      details.isProcessingSuccessful = true;
      return batch;
    }),
    catchError(() => {
      details.isProcessingSuccessful = false;
      return throwError(false);
    }),
    finalize(() => {
      details.isProcessingOccured = true;
    }),
  ));
  return concat(...processes);
}

Angular 5 synchronous HTTP call

Try using await/async

async getResult(): Promise<MyCustomObject> {
    if (typeof this.result === 'undefined') 
    {
        // save result
        this.result = await this.service.call()
        .toPromise()
        .then(resp =>resp as MyCustomObject);//Do you own cast here

    }
    return this.result;
}

---

Related Topics