Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Uncaught (in promise): TypeError: Cannot read property 'perco' of undefined

Estou recebendo o seguinte erro ao finalizar o passo de alteração do preço total ao selecionar os acessórios. OBS: No video é apresentado o mesmo erro no final da explicação porém ao executar "F5" o meu erro não some como no vídeo.

Error: Uncaught (in promise): TypeError: Cannot read property 'preco' of undefined
TypeError: Cannot read property 'preco' of undefined
    at new EscolhaPage (http://localhost:8100/build/main.js:179:39)
    at createClass (http://localhost:8100/build/vendor.js:11293:26)
    at createDirectiveInstance (http://localhost:8100/build/vendor.js:11121:37)
    at createViewNodes (http://localhost:8100/build/vendor.js:12569:49)
    at createRootView (http://localhost:8100/build/vendor.js:12464:5)
    at callWithDebugContext (http://localhost:8100/build/vendor.js:13850:42)
    at Object.debugCreateRootView [as createRootView] (http://localhost:8100/build/vendor.js:13167:12)
    at ComponentFactory_.create (http://localhost:8100/build/vendor.js:10229:46)
    at ComponentFactoryBoundToModule.create (http://localhost:8100/build/vendor.js:3690:29)
    at NavControllerBase._viewInit (http://localhost:8100/build/vendor.js:44766:44)
    at c (http://localhost:8100/build/polyfills.js:3:19132)
    at Object.reject (http://localhost:8100/build/polyfills.js:3:18554)
    at NavControllerBase._fireError (http://localhost:8100/build/vendor.js:44524:16)
    at NavControllerBase._failed (http://localhost:8100/build/vendor.js:44512:14)
    at http://localhost:8100/build/vendor.js:44567:59
    at t.invoke (http://localhost:8100/build/polyfills.js:3:14356)
    at Object.onInvoke (http://localhost:8100/build/vendor.js:4247:33)
    at t.invoke (http://localhost:8100/build/polyfills.js:3:14296)
    at r.run (http://localhost:8100/build/polyfills.js:3:9523)
    at http://localhost:8100/build/polyfills.js:3:19622

EscolhaPage

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import {Carro} from "../../modelos/carro";
import {Acessorio} from "../../modelos/acessorio";

@IonicPage()
@Component({
  selector: 'page-escolha',
  templateUrl: 'escolha.html',
})
export class EscolhaPage {
  public carro: Carro;
  public acessorios: Acessorio[];
  private _precoTotal: number;

  constructor(public navCtrl: NavController, public navParams: NavParams) {
    this._precoTotal = this.carro.preco;
    this.carro = this.navParams.get('carroSelecionado');
    this.acessorios = [
      {nome: 'Freio ABS', preco: 800},
      {nome: 'Ar-Condicionado', preco: 1000},
      {nome: 'MP3 player', preco: 500}
      ];
  }

  get precoTotal(){
    return this._precoTotal;
  }
  atualizaTotal(ativado: boolean, acessorio: Acessorio){
    ativado ?
      this._precoTotal += acessorio.preco :
      this._precoTotal -= acessorio.preco;
  }

}

OBS2: Se eu remover o códigothis._precoTotal = this.carro.preco; e substituir por exemplo por this._precoTotal = 1; o código funciona.

1 resposta
solução!

Boa noite, Kaique! Como vai?

Veja que no construtor da classe EscolhaPage vc faz:

this._precoTotal = this.carro.preco;
this.carro = this.navParams.get('carroSelecionado');

Repare que na primeira linha vc tenta obter o valor do carro selecionado, só que tal carro só é obtido na segunda linha. Por isso vc está tendo esse erro. Basta inverter as linhas para:

this.carro = this.navParams.get('carroSelecionado');
this._precoTotal = this.carro.preco;

Grande abraço e bons estudos, meu aluno!

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