3
respostas

TypeError no parsing do negociacaoController

Referente ao curso TypeScript parte 2: Mais técnicas e boas práticas, no capítulo Lapidando nosso código e atividade Ativando strictNullChecks

por kaique de oliveira
| 149.1k xp | 128 posts

Boa tarde pessoal, depois de aplicar o que foi ensinado na aula apareceu o erro: TypeError: this._inputData.value is undefined[Learn More] system.js line 4 > eval:27:27 adiciona http://localhost:3000/js/controllers/NegociacaoController.js:27:27 segue o codigo do controller:

import { NegociacoesView, MensagemView } from '../views/index';
import { Negociacoes, Negociacao } from '../models/index';
    export class NegociacaoController {

        private _inputData: JQuery;
        private _inputQuantidade: JQuery;
        private _inputValor: JQuery;
        private _negociacoes = new Negociacoes();
        private _negociacoesView = new NegociacoesView('#negociacoesView', true);
        private _mensagemView = new MensagemView('#mensagemView', true);

        constructor() {

            this._inputData = $('#data');
            this._inputQuantidade = $('#quantidade');
            this._inputValor =$('#valor');
            this._negociacoesView.update(this._negociacoes);
        }

    adiciona(event : Event) {

        event.preventDefault();

        const negociacao = new Negociacao(
            new Date(this._inputData.value.replace(/-/g, ',')),
            parseInt(this._inputQuantidade.value),
            parseFloat(this._inputValor.value));

            this._negociacoes.adiciona(negociacao);

            // imprime a lista de negociações encapsulada 
            this._negociacoes.paraArrey().forEach(negociacao => {
                console.log(negociacao.data);
                console.log(negociacao.quantidade);
                console.log(negociacao.valor);
            });
            this._negociacoes.adiciona(negociacao);
            this._negociacoesView.update(this._negociacoes);
            this._mensagemView.update('Negociação adicionada com sucesso');
    }

}

O que eu fiz de errado?

3 respostas
por Wanderson Macêdo
| 3967.1k xp | 8086 posts
Instrutor

Oi Kaique, cola seu HTML aqui pra mim ver como ele tá por favor?

por kaique de oliveira
| 149.1k xp | 128 posts
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Negociações</title>
    <link rel="stylesheet" href="css/bootstrap.css">
    <link rel="stylesheet" href="css/bootstrap-theme.css">
</head>

<body class="container">

    <h1 class="text-center">Negociações</h1>

    <div id="mensagemView"></div>

    <form class="form">

        <div class="form-group">
            <label for="data">Data</label>
            <input type="date" id="data" class="form-control" required autofocus/>        
        </div>    

        <div class="form-group">
            <label for="quantidade">Quantidade</label>
            <input type="number" min="1" step="1" id="quantidade" class="form-control" value="1" required/>
        </div>

        <div class="form-group">
            <label for="valor">Valor</label>
            <input id="valor" type="number" class="form-control"  min="0.01" step="0.01" value="0.0" required />
        </div>

        <button class="btn btn-primary" type="submit">Incluir</button>
    </form>

    <br>
    <br>

    <div id="negociacoesView"></div>

    <script src="lib/jquery.min.js"> </script>
    <script src="lib/system.js"></script>
    <script>
         System.defaultJSExtensions = true;
        System.import('js/app.js').catch(err => console.error(err));
    </script>


</body>
</html>
por Wanderson Macêdo
| 3967.1k xp | 8086 posts
Instrutor

Oi Kaique, tudo bem? Testando aqui vi que o jQuery tá retornando pra você não uma referência para o input diretamente, mas sim um objeto dele que tem acesso ao input, por isso você não consegue fazer o .value direto no campo de data.

Ele traz o input dentro de um array, como primeiro elemento, então para ler o valor do inputData, você teria que fazer:

this._inputData[0].value

Ou usar o índice zero logo na captura do elemento pelo jQuery:

this._inputData = $('#data')[0];