如何构建可返回可观察到的服务

Question

我正在构建一项服务，该服务查询Google Maps放置自动完整的API并返回一系列对象。服务本身非常简单。我正在使用地图JS API。字符串传递给服务，并返回匹配列表。

问题是如何使该服务输出到可观察到的角度？

这就是我现在的位置：

import {Injectable, OnInit} from '@angular/core';
import {Observable} from 'rxjs/Rx';
declare var google: any;
@Injectable()
export class GoogleMapsService {
    getAutocomplete(input = {'input': '', 'types': [] } ) {
        var autocomplete = new google.maps.places.AutocompleteService();
        return autocomplete.getPlacePredictions({ input: input.input });
    }
}

但这不是可观察的，我不能 .subscribe。

Answer 1

文档说autoComplete.getPlacePreDictions具有两个参数：请求和回调函数。因此，您可以做：

Observable.create(obs => {
  let displaySuggestions = function (predictions, status) {
    if (status != google.maps.places.PlacesServiceStatus.OK) {
      obs.error(status);
    }
    else {
      obs.next(predictions);
      obs.complete();
    }
  };
  var service = new google.maps.places.AutocompleteService();
  service.getQueryPredictions({input: 'test'}, displaySuggestions);
});

Answer 2

查看 getQueryPredictions的文档中的示例：

var service = new google.maps.places.AutocompleteService();
service.getQueryPredictions({ input: 'pizza near Syd' }, displaySuggestions);

它希望最后一个参数是接收结果的回调。getPlacePredictions大概是相同的。这表明您可以使用Observable.bindCallback如下：

return Observable.bindCallback(autocomplete.getPlacePredictions)({ input: input.input });

请注意，bindCallback返回一个函数，该函数采用与包装功能相同的参数，减去回调。