How to return method when api response completes

Question

I have a service which is calling two method. And service method I am calling in my component, it returning me undefined.

my service

checkPermission(permissionName: string): boolean {
    const pageLevelCompanySettingName = "Security_Permission_Check_View";

    let permission: boolean;
    this.checkCompanySettingForPermission(
      pageLevelCompanySettingName
    ).subscribe(res => {
      if (res.SysConfig.Value === "true") {
        this.hasPermission(permissionName).subscribe(data => {
          permission = data.permission;
        });
      }

    });
    return permission;
  }

my component

const abc =  this.permission.checkPermission(pageLevelCompanySettingName);
    console.log('final', abc);

score 0 · Answer 1 · answered Sep 02 '21 at 13:47

0

If you are waiting for an http response from an API, then something in your code may need to be awaited. You can try async/await - this may resolve why your "abc" boolean is returning undefined.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function.

answered Sep 02 '21 at 13:47

Dan G

51
8

I am new in Angular. any supportive code for above? – Sep 02 '21 at 13:49
Please add further details to expand on your answer, such as working code or documentation citations. – Community Sep 02 '21 at 13:49

Yaseer · Answer 2 · 2021-09-02T16:51:14.967

You have to do asynchronous method which you calling, that means you have to wait until the second method return response. So have to use the observable in angular (rxjs)


//method 1
    checkPermission(permissionName: string): Observable<boolean> {
       const pageLevelCompanySettingName = "Security_Permission_Check_View";

       let permission$ = new Subject<boolean>();
       this.checkCompanySettingForPermission(pageLevelCompanySettingName).subscribe(res => {
         if (res.SysConfig.Value === "true") {
           this.hasPermission(permissionName).subscribe(data => {
             permission$.next(data.permission);
           });
         }
       });
     return permission$.asObservable();
    }

//method 2 
    checkPermission(permissionName: string): Observable<boolean> {
       const pageLevelCompanySettingName = "Security_Permission_Check_View"; 
    
     return this.checkCompanySettingForPermission(pageLevelCompanySettingName).pipe(
      mergeMap(res => {
        return (res.SysConfig.Value === "true") ? 
             this.hasPermission(permissionName) : of(false)
      })
    );
 }

And you have to subscribe to the service method in your component

this.permission.checkPermission(pageLevelCompanySettingName).subscribe(
(value) => {
   console.log('final', value);
});

And always do the unsubscribe the method where you subscribed in the component

How Can I avoid subscription under subscription? – Sep 02 '21 at 14:59 — , Sep 02 '21 at 14:59
Check above answer. I updated the answer with two approach – Yaseer Sep 02 '21 at 16:52 — Yaseer, Sep 02 '21 at 16:52

How to return method when api response completes

2 Answers2