Trabalhando com Promise no Angular2/4

Uma das mudanças realizadas pela equipe de desenvolvimento do Angular foi a utilização da biblioteca RxJS(Reactive Extensions forJavaScript) para realização de chamadas assíncronas e baseadas em eventos.

Essa e uma simples forma de ser realizar uma requisição utilizando RxJS que fomos apresentados ao estudarmos um pouco sobre serviços no Angular.

Ja a algum tempo no Angular já e possível utilizar as conhecidas Promises para solucionar chamadas assíncronas, como ja eramos acostumados a fazer no AngularJS.

Para utilizar, basta realizar a importação do operador toPromise da biblioteca RxJS da seguinte forma:

Basta importar o operador ToPromise da biblioteca RxJS:

import ‘rxjs/add/operator/toPromise’;

Caso você tenha adiciona o tipo de retorno Observable no seu service, pode deve trocar para um retorno do tipo Promise. Ficando assim

lista(): Promise<FotoComponent[]> {}

Agora sera necessário chamar a função toPromise na sua função de listagem, da seguinte forma:

lista(): Promisse<FotoComponent[]> {
return this.http.get(this.url)
.toPromisse()
.then(res => res.json())
.catch()
}

No final, o código fica da seguinte forma;

Ao final, vamos ter um código talvez um pouco maior, mas que fica muito mais claro de entender para quem já veio ou conhece um pouco do JavaScript.

Hoje em dia a documentação do Angular ja esta toda atualizada utilizando o padrão toPromise para a realização de chamadas assíncronas. Pode pode conferir a documentação aqui.

)