javascript - 在Angular 6的do while循环中延迟递归HTTP get请求

我在等待另一个API调用完成时递归地使用外部API。
通过使用import {HttpClient} from '@angular/common/http'进行http调用

我是该框架的新手，也许代码中做错了一些，但是工作流程如下：

此块进行第一个API调用

initializeCrawling(): void {
this.callCrawlInitializingAPI()       // this method is calling the api
  .subscribe(
    restItems => {
      this.groupCrawlingRestResponse = restItems;
      console.log(this.groupCrawlingRestResponse);
      this.isCrawlActive = false;
    }
  )

this.fetchResults();    // while callCrawlInitializingAPi call executes, this block here must executed on paralel.
}

现在，我宣布全球


  布尔值


false执行完成时将变为this.callCrawlInitializingAPI()的变量。

这是必须递归调用的第二个API调用的代码。

fetchResults(): void {
this.fetchDataApiCall()
  .subscribe(
    restItems => {
      this.groupCrawlingRestResponse = restItems;
      console.log(this.groupCrawlingRestResponse);
    }
  )

}



fetchDataApiCall() {
    do {
      this.http
        .get<any[]>(this.fetchResultsUrl, this.groupCrawlingResultRestResponse)
        .pipe(map(data => data));
      console.log("Delaying 3000");
    } while (this.isCrawlActive);
  }

这里的目标是延迟do-while循环，说1秒。

我已经尝试以下方法：
1-从“ rxjs / internal / operators”导入{delay}并按上述方式使用；

do {
  this.http
    .get<any[]>(this.fetchResultsUrl, this.groupCrawlingResultRestResponse)
    .pipe(map(data => data));
  console.log("Delaying 3000");
  delay(3000);
} while (this.isCrawlActive);

2-如上使用setTimeout（）函数：

do {
 setTimeout(function(){
 this.http
 .get<any[]>(this.fetchResultsUrl, this.groupCrawlingResultRestResponse)
 .pipe(map(data => data));}, 1000)
 } while (this.isCrawlActive)

据我所知，它们都不起作用，并且do while循环不会延迟，并且可以处理while继续过程中的许多调用。

首先，我想知道如何使其工作，其次，因为我是该框架的新手，是否有更好的方法可以使用Angular做到这一点。

谢谢



更新

我的问题有一个正确的答案，如果将来有人会搜索这个问题。

我唯一需要更改的是这行代码
clearInterval(intervalHolder.id)

最佳答案

首先，当您预订包含http事件的函数时，该函数必须返回stream / http-call

fetchDataApiCall() {
  return this.http
    .get<any[]>(this.fetchResultsUrl, this.groupCrawlingResultRestResponse)
    .pipe(map(data => data));
  }

之后，如果要延迟响应，则必须将延迟运算符放在管道中，这样。

fetchDataApiCall() {
  return this.http
    .get<any[]>(this.fetchResultsUrl, this.groupCrawlingResultRestResponse)
    .pipe(map(data => data),
          delay(3000));
  }

更新

正如更新前的评论所述，清除间隔存在一些问题，因此这里是针对这种情况的100％经过测试的解决方案。在第一段代码中有轮询逻辑，只要isActive属性为true，就会每调用500 ms新请求一次。

第二个代码块是模拟请求的服务。

export class ChildOne {
  longReqData;
  shortReqData = [];

  active = true;

  constructor(private requester: RequesterService) {}

  loadData() {
    this.requester.startLongRequest().subscribe(res => {
      this.longReqData = res;
      console.log(res);
      this.active = false;
    });

    let interval = Observable.interval(500);

    let sub = interval.subscribe(() => {
      this.requester.startShortRequest().subscribe(res => {
        this.shortReqData.push(res);
        console.log(res);
      });
      if (this.active === false) {
        sub.unsubscribe();
      }
    });
  }
}

@Injectable()
export class RequesterService {
  private counter = 0;
  stop() {
    this.subject.next(false);
  }
  startShortRequest() {
    this.counter += 1;
    let data = {
      delay: 0,
      payload: {
        json: this.counter
      }
    };
    return this.mockRequest(data);
  }

  startLongRequest() {
    let data = {
      delay: 3000,
      payload: {
        json: "someJSON"
      }
    };
    return this.mockRequest(data);
  }
  mockRequest(data) {
    return Observable.of(data).pipe(delay(data.delay));
  }
}

关于javascript - 在Angular 6的do while循环中延迟递归HTTP get请求，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/50485599/