angularjs - Ionic 3 - 异步 Http 调用和 Ionic 加载问题

Question

我想获得一些有关在异步函数中处理多个 HTTP 调用时使用 Ionic LoadingController 的帮助。

首先，这是我的带有 promises 的异步函数

LoadDatafromUrls(urLs) {
    return new Promise((resolve, reject) => {
      let loader = this.loadingCtrl.create({
        content: 'Son Bilgiler Alınıyor',
      });
      var urlCalls = [];
      urLs.forEach((entry: any) => {
        loader.present().then(()=>{
          this.http.get(entry.url).map((response : Response)=>{
            console.log(response.json());
            urlCalls.push(response.json());
          }).subscribe(()=>{
            console.log("subscribe");
          });
          loader.dismiss();
        })
      })
      Promise.resolve(urlCalls).then((res)=>{
        console.log(res);
        resolve(res);
      },
      (res)=>{
        reject(res);
      })
      //return Promise;
    })
  }

其次，我是这样调用它的。

RequestObject.LoadDatafromUrls(urLs).then((results)=>{
        console.log(results);
      },
      (errors)=>{
        console.log(errors);
      })

在这种方法中，我收到以下错误消息:

错误消息:未捕获( promise ):未找到 removeView。此外，它并不像我期望的那样工作。

我真的对全新的方法、新方式持开放态度。如果我能有更好的实现，请分享。

Answer 1

因为每次调用得到响应后你都隐藏了加载器。当 Ionic 尝试关闭加载器但 View 上没有加载器时，它会抛出此错误。只有在所有调用都已解决后才关闭加载程序

 loader.present();
 urLs.forEach((entry: any) => {
     //   loader.present().then(()=>{
          urlCalls.push(this.http.get(entry.url).map((response : Response)=>{
            console.log(response.json());
            return response.json();
          }).subscribe(()=>{
            console.log("subscribe");
          }).toPromise());
         // loader.dismiss();
        })
     // })
 Promise.all(urlCalls).then((res)=>{
        console.log(res);
        resolve(res);
        loader.dismiss()
      },
      (res)=>{
        reject(res);
      })

编辑: 如何使用 resolve multiple observables？

    getData(urls){
     var loader = this.loadingCtrl.create({
       content : "Loading..."
     });
     loader.present();
     this.LoadDatafromUrls(urls).subscribe(res=>{
        console.log(res)//array of responses
        loader.dismiss();
     },err=>{
        console.log(err);// it will fire if any one call fails
        loader.dismiss();
      }); 
    }
    LoadDatafromUrls(urls){
     var arrObservables = [];         
     for(var i = 0; i < urls.length; i++){
         arrObservables.push(this.http.get(urls[i]).map((res: Response)=>{
           return res.json()
         }).catch((err: Response)=>{
           return Observable.throw(err);
         }))
     }
     return Observable.forkJoin(arrObservables);
    }

记住:在您的组件中添加这些导入语句:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/catch';
import 'rxjs/add/observable/throw';
import 'rxjs/add/observable/forkJoin'