最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - How to await a subscribe in angular - Stack Overflow

programmeradmin2浏览0评论

my question is very simple... Consider the following angular method:

fillOrderHeader() {
    let rows3:Array<OrderHeader>= new Array<OrderHeader>();
    this.orderService.getAllOrdersHeaders().subscribe(headerList=>{
      headerList.forEach(headerDoc=>{
        headerDoc.get().subscribe(header=>{
          let headerMetadata:OrderHeader= new OrderHeader();
          headerMetadata.clientName= header.data().clientName;
          headerMetadata.agencyName=header.data().agencyName;
          rows3.push(headerMetadata);
        });
      })
    });
    return rows3;
  }

How to await to subscription before to return a row3 array?

Many thanks!

my question is very simple... Consider the following angular method:

fillOrderHeader() {
    let rows3:Array<OrderHeader>= new Array<OrderHeader>();
    this.orderService.getAllOrdersHeaders().subscribe(headerList=>{
      headerList.forEach(headerDoc=>{
        headerDoc.get().subscribe(header=>{
          let headerMetadata:OrderHeader= new OrderHeader();
          headerMetadata.clientName= header.data().clientName;
          headerMetadata.agencyName=header.data().agencyName;
          rows3.push(headerMetadata);
        });
      })
    });
    return rows3;
  }

How to await to subscription before to return a row3 array?

Many thanks!

Share Improve this question asked Oct 4, 2018 at 19:49 AlejoDevAlejoDev 3,19811 gold badges40 silver badges67 bronze badges 2
  • 1 You need to convert the observable to a promise, there is an rxjs operator for this, and await the result. Then use await instead of the .subscribe. – Aluan Haddad Commented Oct 4, 2018 at 19:53
  • @AluanHaddad Ok, how?... Many thanks! – AlejoDev Commented Oct 4, 2018 at 19:55
Add a ment  | 

2 Answers 2

Reset to default 5

async/await can only work with Promises. So to make it work in your example, you'll have to change your Observable(s) into Promise(s).

Good thing though is, you can simply use the toPromise API on an Observable for doing that.

Another thing that you'll have to do is declare your fillOrderHeader function as async. To do that you'll have to await the calls to this.orderService.getAllOrdersHeaders().toPromise() and headerDoc.get().toPromise()

Try this:

async fillOrderHeader() {

  let rows3: Array<OrderHeader> = new Array<OrderHeader>();
  const headerList = await this.orderService.getAllOrdersHeaders().toPromise();

  for(let headerDoc of headerList) {

    const header = await headerDoc.get().toPromise();

    let headerMetadata: OrderHeader = new OrderHeader();
    headerMetadata.clientName = header.data().clientName;   
    headerMetadata.agencyName = header.data().agencyName;

    rows3.push(headerMetadata);      
  }
  return rows3;
}

try this:

async fillOrderHeader() {
   let rows3: Array<OrderHeader>= new Array<OrderHeader>();

   let headerList = await this.orderService.getAllOrdersHeaders().toPromise();
   for(let headerDoc of headerList){
       let header = await headerDoc.get().toPromise();
       let headerMetadata: OrderHeader = new OrderHeader();
       headerMetadata.clientName  = header.data().clientName;
       headerMetadata.agencyName = header.data().agencyName;
       rows3.push(headerMetadata);
   }

   return rows3;
 }
发布评论

评论列表(0)

  1. 暂无评论