2015-12-24 8 views
7

NG 1.XサービスをNG 2.0に変換しています。私はhttpを使用してObservableを返す、アンギュラ2.0サービスであることをsearchサービスを変換したい角度2.0 - 約束をオブザーバブルに変換する

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; 
     }); 
    }; 

マイNG 1.xのサービスは(簡体字)約束のチェーンを持っています。私はgetAccessTokenサービスをそのままにしておくことをお勧めします。これは約束を返すNG 1.Xサービスです。

私は以前の "約束"サービスでObservable.fromPromiseを使用することを考えていました。

どうすればいいですか?どのように私はこれらの2つをチェーンできますか?

EDIT:あなたはsearch方法が観測オブジェクトを返す作るべき

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

これは明らかです。私の問題は、関数からこの値を返す方法です。私はそれをチェーンすることはできません! –

答えて

8

だけ明確にする、私はそれがこのような何かになりたいです。このような何か:

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

答えをありがとう。私の質問はObservableを使ったAngular 2.0の 'http'になるための第二の約束をどうやって変えるのですか? –

+0

あなたは内部$ httpを意味しますか? – dfsq

+0

私は明確にするために私の質問を編集 –

3

私はbeta.0にdfsqのPlunker @に変換。 map()は、インポートすることなくもう使用できないようです(ただし、ここでは必要ありません)。

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

関連する問題