How to return list inside subscribe Angular-CodePudding

winServiceInfo() {
    this.dataArrs=[]
    this.winServiceURL = JSON.parse(this.WinService[0].windowsServicesInfo)["Stactuscheck"];
    this.service.getWinServicesInfo(this.winServiceURL)
    .pipe(
      catchError(this.handleError)
    )
    .subscribe((data: any) => {
        this.setSubscribeData(data);
        console.log(this.dataArrs)
    });
    console.log(this.dataArrs)
    return this.dataArrs;
}

setSubscribeData(data): any {
    this.WinService = data.windowsServicesInfo;
    this.dataArrs = this.getKeyValJsonObj();
return this.dataArrs;
}

the first console.log(this.dataArrs) retuens Arrar(3) but the second console.log(this.dataArrs) returns Arrar(0). I understand that subscribe is an asynchronous operation and for that reason.

So how to handle the situation to return the Array(3) from second console.log(this.dataArrs)

CodePudding user response：

instead of subscribing inside the function you need to return the Observable

this.dataArrs = winServiceInfo() {
  this.winServiceURL = 
  JSON.parse(this.WinService[0].windowsServicesInfo)["Stactuscheck"];
  return this.service.getWinServicesInfo(this.winServiceURL)
     .pipe(
        catchError(this.handleError)
          );
}

and in your template:

<tr *ngFor="let opc of dataArrs | async"> <tr>

and however call this function can subscribe to get the data

CodePudding user response：

@Eli Porush The reason of calling winServiceInfo() in html page because every url is having dataArr list. so that why i want the value dataArr outside the subscribe

Please find the code snippet for the reference, each dataArr is different for different this.winServiceURL

Please do the needfull. You valuable is highly appreciable

Template

<div  *ngFor="let otc of this.jsonData;index as j">
        <div>
            <table >
             
    <tr *ngFor="let opc of this.winServiceInfo(j);index as i">

Typescript

 winServiceInfo(j: number) {
    this.winServiceURL = JSON.parse(this.WinService[j].windowsServicesInfo)["Stactuscheck"];
    this.dataArrs = [];
    this.service.getWinServicesInfo(this.winServiceURL)
      .pipe(
        catchError(this.handleError)
      )
      .subscribe(
        (data: any) => {
          this.setSubscribeData(data);
          console.log(this.dataArrs);
          return this.dataArrs;
        });
    console.log(this.dataArrs);
    return this.dataArrs;
  }

setSubscribeData(data): any {
    this.WinService = data.windowsServicesInfo;
    this.dataArrs = this.getKeyValJsonObj();
    return this.dataArrs;
  }

getKeyValJsonObj() {
    this.dataArr = [];
    for (let key of this.sliceIntoChunks()) {
      for (let i in key) {
        this.dataArr.push({ 'key': i, 'value': key[i] });
      }
    }
    return this.dataArr;
  }

Error ERROR TypeError: Cannot read properties of undefined (reading 'windowsServicesInfo')