Angular 7 - синхронные http запросы - PullRequest
Новая
       39

Angular 7 - синхронные http запросы

0 голосов
/ 17 марта 2019

Я собираю данные из API WordPress и помещаю их в массив, используя несколько запросов после нажатия кнопки, которая запускает initGetComments () функция.

Массивы: 

  singleCommentResults: CommentsItem[] = [];
  commentsResults = [];

Функция инициализации: 

  initGetComments(){
    var btn = document.getElementById("comment_btn");

    if (!btn.classList.contains('clicked')){
      var posts = document.getElementsByClassName('single-post');

      for( var i = 0; i < posts.length; i++ ) {
        this.getComments(posts[i].id).subscribe(data => {
          this.singleCommentResults = data;
          this.commentsResults.push(this.singleCommentResults[0]);
          console.warn("commentsResults =", this.commentsResults);
        })
      }
    } else {
      console.log('Comments already downloaded!')
    }

    btn.classList.add("clicked");
  }

функция получения: 

  getComments(ID:string): Observable<CommentsItem[]> {
    console.log(ID);

    return this.http
      .get(`https://public-api.wordpress.com/rest/v1/sites/en.blog.wordpress.com/posts/${ID}/replies/?number=1`)
      .map(res =>
        res.comments.map(
          item =>
            new CommentsItem(
              item.post.ID,
              item.ID,
              item.author.name,
              item.author.avatar_URL,
              item.date,
              item.raw_content
            )
        )
      );
  }

На данный момент все этизапросы отправляются в одно и то же время, и я хотел бы отправить каждый из них после завершения предыдущего.

1 Ответ

0 голосов
/ 22 марта 2019

Используйте рекурсивную функцию следующим образом:

Функция инициализации: Изменено 

initGetComments(){
    var btn = document.getElementById("comment_btn");

    if (!btn.classList.contains('clicked')){
      var posts = document.getElementsByClassName('single-post');

      // Call to new function to fetch comments for first post
      this.getSyncComment(0, posts)

    } else {
      console.log('Comments already downloaded!')
    }

    btn.classList.add("clicked");
}

Новая функция для синхронного получения комментария 

getSyncComment(n, posts){
    if (n == posts.length) {
    return 
    }


    this.getComments(posts[n].id).subscribe(data => {
        const singleCommentResults = data; // Changed
        this.commentsResults.push(singleCommentResults[0]); // Changed
        console.warn("commentsResults =", this.commentsResults);

        // Make recursive call to fetch comment for next post
        this.getSyncComment(n+1, posts);
      });
  }
...