Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Código em TypeScript 3.2.2

Estou utilizando a versão mais recente do TypeScript, vi que alguns alunos tiveram problema de tipagem do compilador ao usar versões mais recentes também. Consegui resolver realizando algumas alterações:

=> Promise<void | Negociacao[]>

=> negociacoes: Negociacao[]

... classe NegociacaoService

import { Negociacao, NegociacaoParcial } from "../models/index";

export class NegociacaoService {

    obterNegociacoes(handler: Function): Promise<void | Negociacao[]> {

        return fetch('http://localhost:8080/dados')
            .then(response => handler(response))
            .then(response => response.json())
            .then((dados: NegociacaoParcial[]) => dados
                .map(dado => new Negociacao(new Date(), dado.vezes, parseFloat((dado.montante / dado.vezes).toFixed(2))))
            )
            .catch(err => console.log(err.message));
    }
}

... classe NegociacaoController

    @throttle()
    importa() {

        function isOK(response: Response) {
            if (!response.ok) 
                throw new Error(response.statusText);
            return response;
        }

        this._service.obterNegociacoes(isOK)
            .then((negociacoes: Negociacao[]) => {
                negociacoes.forEach(negociacao => this._negociacoes.adiciona(negociacao));
                this._negociacoesView.update(this._negociacoes);
            });
    }
4 respostas
solução!

O problema é que estamos tratando qualquer erro através do "catch", e nesse caso, realmente o fetch pode não retornar uma Negociacao[]. Por isso as versões mais recentes do TypeScript exigem que tipamos a Promise como <void | Negociacao>. Um outro aproach para evitar isso seria, ou não tratar a exceção (não utilizar o "catch"), ou tratar, mas propagar a exceção através de "throw".

... Classe NegocicaoService

    async obterNegociacoes(handler: HaldlerFunction): Promise<Negociacao[]> {

        return fetch('http://localhost:8080/dados')
            .then(response => handler(response))
            .then(response => response.json())
            .then((dados: NegociacaoParcial[]) => dados
                .map(dado => new Negociacao(new Date(), dado.vezes, parseFloat((dado.montante / dado.vezes).toFixed(2))))
            );
            //.catch(err => console.log(err.message));
    }

... classe NegociacaoController

    @throttle()
    importa() {
        this._service.obterNegociacoes(response => {
            if (!response.ok) 
                throw new Error(response.statusText);
            return response;
            })
            .then(negociacoes => {
                negociacoes.forEach(negociacao => this._negociacoes.adiciona(negociacao));
                this._negociacoesView.update(this._negociacoes);
            })
            .catch((err: Error) => {
                this._mensagemView.update('Não foi possível importar os dados.');
                console.log(err.message);
            });
    }
}

Boa tarde, Sanyo! Como vai?

Obrigado por compartilhar com a comunidade da Alura a sua solução! Assim todos crescemos juntos!

Aproveito para contribuir e dizer que no caso de um erro, o catch também poderia retornar um array vazio de Negociacao. Desse modo não haveria necessidade do void na declaração do método.

Um excelente ano de 2019 pra vc, com muito estudo e sucesso!

Grande abraço, meu aluno!

muito obg por ajudar, resolveu meu problema.

Fala Sanyo! Tudo bom?

Valeu por compartilhar a sua solução, contribuições são sempre bem-vindas para ajudar a comunidade.

Não se esqueça que você pode contar conosco caso tenha alguma dúvida, mas também não deixe de compartilhar suas descobertas!

Um grande abraço!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software