5
respostas

Retorna erro do JSON.

Boa tarde,

So uma duvida,

Quando a pessoal envia o usuario ou senha errado, na mesma hora é retorna um json com o seguinte:

{"mensagem":"Usuário não cadastrado!"}

Como eu faço para mostrar essa mensagem no alert?

import { Component } from '@angular/core';
import { NavController, NavParams, AlertController } from 'ionic-angular';
import { HomePage } from '../home/home';
import { UsuarioService } from '../../domain/usuario/usuario-service';

@Component({
  selector: 'page-login',
  templateUrl: 'login.html'
})
export class LoginPage {

  public email: string = 'joao@alura.com.br';
  public senha: string = 'alura123';

  constructor(
    public navCtrl: NavController, 
    public navParams: NavParams, 
    private _service: UsuarioService, 
    private _alertCtrl: AlertController) {}

  efetuaLogin() { 

    this._service
      .efetuaLogin(this.email, this.senha)
      .then(usuario => {
        console.log(usuario);
        this.navCtrl.setRoot(HomePage)
      })
      .catch(() => {
        this._alertCtrl.create({
          title: 'Problema no login',
          subTitle: 'Email ou senha inválidos. Verifique',
          buttons: [{ text: 'Ok'}]
        }).present();
      });
  }
}

Poderia me ajudar? desde ja agradeço.

5 respostas

Oi Renan, primeiro você precisa receber a resposta por parâmetro da mesma forma que recebe o usuário quando tem sucesso, depois é só acessa a propriedade mensagem. Vê se funciona assim:

.catch((erro) => {
        this._alertCtrl.create({
          title: 'Problema no login',
          subTitle: erro.mensagem,
          buttons: [{ text: 'Ok'}]
        }).present();
      });

Boa tarde, Wanderson

Tentei oque voce fez, porem nao funcionar...

o campo fica como : undefined

Faz um console.log(erro) e vê o que tá sendo impresso no console.

Console.log(erro).

Mostra isso:

SyntaxError: Unexpected token d in JSON at position 24
    at JSON.parse (<anonymous>)
    at Response.Body.json (body.js:22)
    at MapSubscriber.project (usuario-service.ts:30)
    at MapSubscriber._next (map.js:77)
    at MapSubscriber.Subscriber.next (Subscriber.js:89)
    at XMLHttpRequest.onLoad (xhr_backend.js:72)
    at t.invokeTask (polyfills.js:3)
    at Object.onInvokeTask (ng_zone.js:227)
    at t.invokeTask (polyfills.js:3)
    at e.runTask (polyfills.js:3)

Então o JSON que você está recebendo de volta tem algum problema Renan, por isso você não consegue usar ele. É uma boa ideia verificar como esse JSON está sendo criado.