我可以将 async/await Promise 与 observable RXJS 混合使用吗?

SDL*_*UJO 6 observable rxjs ionic-framework rxjs5 angular

我正在使用 ionic/angular 和 RXJS observables。

我正在尝试使用 Rxjs observables 重构我的代码,我有下一个代码:

ionViewWillEnter() {
    if (this.platform.is('core') || this.platform.is('mobileweb')) {
      this.lat = 37.3675506;
      this.lng = -6.0452695;
      this.printMap();
    } else {
      if (this.platform.is('android')) {       
        this.tryGeolocation();            
      } else if (this.platform.is('ios')) {
        console.log("IOS")
      }
    }
  }
Run Code Online (Sandbox Code Playgroud)

如果用户从 android 移动设备访问我应该检查:isLocationAuthorized、isLocationEnabled() 以使用 getCurrentPosition() 获取当前位置,然后我必须在使用 Observables forkjoin 的地方打印 Map。

问题是检查方法返回承诺,我不知道如何链接这个流程。

tryGeolocation 是下一个:

 async tryGeolocation() {
    try {
      if (await this.diagnostic.isLocationAuthorized()) {
        if (await this.diagnostic.isLocationEnabled()) {
          this.loading = this.loadingCtrl.create({
            content: 'Localizando...',
            dismissOnPageChange: true
          });
          this.loading.present();
          const {coords} = await this.geolocation.getCurrentPosition();
          this.lat = coords.latitude;
          this.lng = coords.longitude;
          this.loading.dismiss();
          alert(this.lat);
          alert(this.lng);
          this.printMap();
        } else {
         console.log("error1")
        }
      } else {
console.log("error2")
      }
    } catch (e) {
      console.log('Error getting location', e);
    }
  }


printMap() {
    let obs1 = this._sp.getLocationsByPosition(this.lat, this.lng);
    let obs2 = this._sp.getUserFavoriteLocations2();
    this.subscription = forkJoin([obs1, obs2]).subscribe(results => {
      this.allLocations = results[0];
      this.myLocations = results[1];
      this.allLocations = this.allLocations.filter(item => !this.myLocations.some(other => item.id.sid_location === other.id.sid_location && item.id.bid_environment === other.id.bid_environment));   

      this.map = new google.maps.Map(this.mapElement.nativeElement, {
        zoom: 13,
        center: {lat: parseFloat(this.lat), lng: parseFloat(this.lng)},
        zoomControl: true,
        draggable: true            
      });

      new google.maps.Marker({
        position: {lat: parseFloat(this.lat), lng: parseFloat(this.lng)},
        map: this.map,
        icon: {
          url: "https://maps.gstatic.com/mapfiles/api-3/images/spotlight-poi2_hdpi.png"
        }
      });
      this.printMarkers();
    });
  }
Run Code Online (Sandbox Code Playgroud)

我试图将承诺转换为这样的可观察对象:

let obs1 = Observable.fromPromise(this.diagnostic.isLocationAuthorized());
    let obs2 = Observable.fromPromise(this.diagnostic.isLocationEnabled());
    let obs3 = Observable.fromPromise(this.geolocation.getCurrentPosition());

    obs1.flatMap(() => obs2)
      .flatMap(() => obs3)
      .subscribe(coords => {
        console.log(coords);
//CALL TO printMap?
      })
Run Code Online (Sandbox Code Playgroud)

有人可以帮助我实现重构我的代码的流程吗?

先感谢您

Lui*_*yfe 0

Rxjs 可观察值和 Promises推迟文档

话虽如此,fromPromise已弃用,它不再出现在文档中。用于from 从 Promise 中获取 observable

import { from } from 'rxjs';

let obs1 = from(this.diagnostic.isLocationAuthorized());
let obs2 = fromPromise(this.diagnostic.isLocationEnabled());
let obs3 = fromPromise(this.geolocation.getCurrentPosition());
Run Code Online (Sandbox Code Playgroud)

但请考虑一下这对于您的用例是否值得。这个答案将帮助您做出决定

事实证明,您可以将 async-await 与 observables 混合使用,但这并不意味着它适合您的用例。(谨慎使用此代码

import { defer } from 'rxjs';
defer(async function() {
  const a = await promiseDelay(1000).then(() => 1);
  const b = a + await promiseDelay(1000).then(() => 2);
  return a + b + await promiseDelay(1000).then(() => 3);
})
.subscribe(x => console.log(x)) // logs 7
Run Code Online (Sandbox Code Playgroud)

  • 您写了“异步等待和可观察对象不能一起工作。» 并且您链接的页面上写着“RxJS 从一开始就与 Promises 具有高度的互操作性。»,继续详细解释它们如何*确实*协同工作...... (2认同)