Ионный 2/Угловой 2 обещание, возвращаемый наблюдаемым

Question

У меня есть ситуация, когда мне нужно извлечь часть данных из хранилища в приложении Ionic 2, а затем использовать эти данные для создания HTTP-запроса. Проблема, с которой я сталкиваюсь, заключается в том, что методы SqlStorage возвращают обещания, а http meth возвращает наблюдаемые. У меня сделать что-то вроде этого, чтобы заставить его работать:

getToken() { 
    return this.storage.get('token').then((token) => { 
     this.token = token; 
     return token; 
    }); 
} 

loadStuff(){ 
    return this.tokenService.getToken().then(token => { 
     return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token).map(res => res.json()); 
    }); 
    } 

, а затем сделать что-то вроде этого, чтобы заставить его работать:

this.tokenService.loadStuff().then(observable => { 
    observable.subscribe(data => { 
     this.storage.set('stuff', data); 
     return data; 
    }); 
}) 

Я очень новой для угловых и ионического в общем, поэтому я чувствую, что есть намного лучший способ выполнить то, что я пытаюсь сделать, но я просто не знаю, как это сделать. Кроме того, все доступные ресурсы в отношении наблюдаемых получают очень сложно очень быстро, что оставляет впечатлительный молодой разработчик, как я, очень смущен.

Может ли кто-нибудь пролить свет на то, как это сделать лучше? Благодаря!

Answer 1

В угловом 2 функции обслуживания Http (get, post и т. Д.) Возвращают Observable object. Это именно то, как они его реализовали.

Если вы привыкли к обещаниям и хотите, чтобы ваша служба вернула обещание, вы можете использовать функцию toPromise, которая построена в Observable объектах.

loadStuff(){ 
    return this.tokenService.getToken().then(token => { 
     return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token).toPromise()); 
    }); 
} 

А потом

this.tokenService.loadStuff().then(data => { 
    data = data.json(); //you might need to do that, depending on the structure of the response 
    this.storage.set('stuff', data); 
    return data; 
});  

Answer 2

Вот что вы можете сделать:

Ваш код ниже

getToken() { 
    return this.storage.get('token').then((token) => { 
     this.token = token; 
     return token; 
    }); 
} 

изменения

getToken: Observable<any> = 
    Observable.fromPromise(this.storage.get('token').then(token => { 
    //maybe some processing logic like JSON.parse(token) 
    return token; 
})); 

Тогда в вашем компоненте вы можете потреблять его, как и любой другой наблюдаемый.

this.serviceClass.getToken.subscribe(token => { 
//whatever you want to with the token 
}); 

Answer 3

Я получил его на работу, используя комбинацию Observable.fromPromise() и .flatMap():

getToken() { 
    return Observable.fromPromise(this.storage.get('token') 
    .then((token) => { 
     return token; 
    })); 
} 

loadStuff(){ 
    return this.tokenService.getToken() 
    .flatMap(token => { 
     return this.http.get("https://www.urltodatasource.com/api/v1/Endpoint?access_token="+token) 
     .map(res => { 
      return res.json(); 
     }); 
    }); 
} 

this.tokenService.loadStuff().subscribe(data => { 
    this.storage.set('stuff', data); 
    return data; 
}); 

Вам также нужно добавить этот импорт:

import { Observable } from 'rxjs/Observable'; 
import 'rxjs/add/operator/map'; 
import 'rxjs/add/observable/fromPromise'; 
import 'rxjs/add/operator/mergeMap'; 

Answer 4

Используйте 'Observable.fromPromise ' конвертировать обещание в наблюдаемое.