2015-12-24 13 views
7

Zamieniam usługę NG 1.X na NG 2.0.Angular 2.0 - konwertowanie wiążącego obietnicę na Observables

Moja NG serwis 1.X ma łańcuchowym obietnica (uproszczony):

dataService.search = function(searchExp) { 
     return this.getAccessToken() 
     .then(function(accesstoken) { 
     var url = $interpolate('https://my-api-url?q={{search}}&{{accesstoken}}')({search: searchExp, accesstoken: accesstoken}); 
     return $http({ 
      url: url, 
      method: 'GET', 
      cache: true 
     }); 
     }).then(function(response) { 
     return response.data; 
     }); 
    }; 

chcę przekonwertować search usługę być kątowym 2,0 Service, korzystając http i powrocie Observable. Wolę pozostawić usługę getAccessToken nietkniętą, jako usługę NG 1.X, która zwraca obietnicę.

Myślałem o używaniu Observable.fromPromise w starej usłudze "obietnica".

Jak mogę to zrobić? Jak mogę połączyć te dwa?

EDIT:

Właśnie w celu wyjaśnienia, że ​​ma to być coś takiego:

dataService.search = function(searchExp) { 
return this.getAccessToken() 
     .then(function(accesstoken) { 
      //Here I want to use: 
      // this.http.get(url).subscribe(() => ...) 
      }); 
     }; 
+1

'Observable.fromPromise (dataService.search)'? –

+1

Jest to oczywiste. Mój problem polega na tym, jak zwrócić tę wartość z funkcji? Nie mogę tego połączyć! –

Odpowiedz

8

Należy dokonać search Sposób powrotu do zaobserwowania obiekt. Coś takiego:

dataService.search = function(searchExp) { 

    var promise = new Promise((resolve, reject) => { 
     this.getAccessToken() 
      .then(accesstoken => { 
       return this.http.get('data.json') 
        .map(response => response.json()) 
        .subscribe(data => resolve(data), err => reject(err)) 
      }) 
    }); 

    return PromiseObservable.create(promise); // Observable.fromPromise(promise) 
}; 
+0

Dzięki za odpowiedź. Moje pytanie brzmi: jak zmienić drugą obietnicę, aby stać się Angular 2.0 'http', który używa Observable. –

+0

Masz na myśli wewnętrzny http? – dfsq

+0

Zmodyfikowaliśmy moje pytanie, aby wyjaśnić –

3

Przekonwertowałem Plunker @ dfsq na wersję beta.0. map() nie wydaje się już dostępny bez importowania go (ale nie potrzebujemy go tutaj).

import {Component, Injectable} from 'angular2/core'; 
import {HTTP_PROVIDERS, Http} from 'angular2/http'; 
import {PromiseObservable} from 'rxjs/observable/fromPromise'; 

@Injectable() 
export class DataService { 
    constructor(private _http: Http, private _accessService: AccessService) {} 
    search(searchExp) { 
    var promise = new Promise((resolve, reject) => { 
     this._accessService.getAccessToken() // see Plunker for AccessService 
     .then(accessToken => { 
      return this._http.get('data.json') // use accessToken here 
      .subscribe(res => resolve(res.json()), err => reject(err)); 
     }); 
    }); 
    return PromiseObservable.create(promise); 
    } 
} 
@Component({ 
    selector: 'my-app', 
    providers: [HTTP_PROVIDERS, AccessService, DataService], 
    template: `<h2>Data loaded</h2><pre>{{data | json}}</pre> 
    ` 
}) 
export class AppComponent { 
    data: any; 
    constructor(private _dataService: DataService) { 
    console.clear(); 
    } 
    ngOnInit() { 
    this._dataService.search('test') 
     .subscribe(res => { 
     this.data = res; 
     }); 
    } 
} 

beta.0 Plunker