首页 > 解决方案 > 响应后调用函数

问题描述

使用 Angular,我试图将一个大功能分成多个较小的功能。使用以下内容:

getSites() {
  this.http.get(`https://example.com/dev/_api/web/lists/getbytitle('Site Master')/items?$select=*,Hub/Title&$expand=Hub&$filter=Hub/Title eq 'Project Hub' and Active eq 'Yes'`).subscribe(data => {
    console.log(`project sites`, data['value'])
    this.sites = data['value']
    this.getLists() //Wait for this.sites to populate, then fire
  })
}

getLists() {
  this.sites.forEach(site => {

    this.http.get(`${site['Site']}/_api/web/lists/?$select=*&$filter=BaseTemplate eq 171`).subscribe(data => {
      console.log("Site's lists", data['value'])
      this.getTasks(data['value'], site)
    })

  })
}

但是,getLists()在触发之前this.sites可以从第一个请求中完全填充。我该如何解决这个问题?

标签: angular

解决方案


您可以使用 concatMap 管道代替订阅这两个函数(它将等到 getSites 完成)

getSites():Observable<any>{
    this.http(...).pipe(map(() => ....)
}
getList(): Observable<any>{
    // do some stuff
}

// and use it like this 
getSites().pipe(contactMap((getSiteResult) => getList(getSiteResult)).subscribe()

希望能帮助到你


推荐阅读