如何将回调函数放在 Rxjs 的可观察量中



场景

我正在使用Angular2开发一个Ionic2应用程序,用户可以在其中选择其国家/地区内的位置。哪个工作正常。我正在使用谷歌地方自动完成 API。但我想通过在我的应用程序中使用 Rxjs 在可观察量中使用此 API 的一些方法。

以下是我当前的代码,工作正常:

首页.html

<ion-header>
    <ion-toolbar>
    <ion-searchbar [(ngModel)]="autocomplete.query" [showCancelButton]="true" (ionInput)="updateSearch()"></ion-searchbar>
    </ion-toolbar>
</ion-header>
<ion-content padding>
    <ion-list>
        <ion-item *ngFor="let item of autocompleteItems" tappable (click)="chooseItem(item)">
  {{ item }}
        </ion-item>
    </ion-list>
</ion-content>

首页

city: string;
address;
autocompleteItems;
autocomplete;
service = new google.maps.places.AutocompleteService(); 
constructor(public navCtrl: NavController, platform: Platform, private zone: NgZone) {
this.city = "Karachi";
this.autocompleteItems = [];
this.autocomplete = {
  query: ''
};
this.address = {
  place: ''
}
}

chooseItem(item: any) {
    item.split[','];
    console.log(item);
    this.autocomplete.query = item[1];
}
updateSearch() {
    if (this.autocomplete.query == '') {
    this.autocompleteItems = [];
    return;
}
let me = this;
this.service.getPlacePredictions({ 
    input: this.autocomplete.query, componentRestrictions: {country: 'PK'} 
  }, function (predictions, status) {
  me.autocompleteItems = []; 
  me.zone.run(function () {
    if(predictions != null){
        predictions.forEach(function (prediction) {
        me.autocompleteItems.push(prediction.description);
      });
    }
    else {
      return;
    }
  });
});
}

问题

在可观察量中转换上述代码后,它向我显示了一个错误Property 'getPlacePredictions' does not exist on type '{}'.请帮助我在这种情况下如何转换 Rxjs 可观察量中的update()函数代码。

以下是我的可转换代码:

ngOnInit() {
Observable.from(this.service).map((data) => {
  return data.getPlacePredictions({ 
    input: this.autocomplete.query, componentRestrictions: {country: 'PK'} 
  }, (predictions, status) => {
      return predictions;
  })
 }).subscribe(console.log) //Final Results}
}

试试这个。

链接: http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#static-method-bindCallback

let getPlaces = Obserable.bindCallback(this.service.getPlacePredictions)
getPlaces({ 
  input: this.autocomplete.query, componentRestrictions: {country: 'PK'} 
}). subscribe(predictions, status) => {
  console.log(predictions, status);
})

相关内容

  • 没有找到相关文章

最新更新