Tratar Status Code Http

Você está usando qual versão do Angular? No curso de Angular 6, no terceiro módulo que está para sair eu ensino isso. Se você usa o HttpClient eu te mostro como se faz. Aguardo seu retorno.

Flávio, estou usando a versão 6 do Angular. Estou acompanhando seu curso, que são ótimos, porém ainda estou no módulo 2 da primeira parte do Angular 6.

Meu código está mais ou menos igual abaixo:

Component

  temSenha(){
    const cpf = this.loginForm.get('cpf').value.replace(/[^0-9]/g,'');

    this.loginPortalService
    .verificaSenhaCadastrada(cpf)
    .subscribe(
      retTemSenha => this.retTemSenha = retTemSenha,
      err => console.log('Erro Callback: ' + err.message )  )
    ;
  }

E no Service:

  verificaSenhaCadastrada(cpf:string){
    return this.http.get<Object[]>(environment.URL_PORTAL_ClIENTE + 'verifica-senha-cadastrada/' + cpf);
  }

Response da API: {"status":"NOT_FOUND","messages":["O CPF não possui senha cadastrada"]}

Retorno no Component:

login-portal.component.ts:47 Erro Callback: Http failure response for http://localhost:8080/api/clientes/verifica-senha-cadastrada/00000000000: 404 Not Found

Retorno do Service:

GET http://localhost:8080/api/clientes/verifica-senha-cadastrada/00000000000 404 (Not Found)

Mostre o código do método

verificaSenhaCadastrada

Vi que postou já o código. Se você retorna 404 será sempre um erro para o HttpClient. Você já trata isso no callback de erro é lá pode tomar a decisão do que fazer. Isso não foi suficiente?

.subscribe(
      retTemSenha => this.retTemSenha = retTemSenha,
      err => console.log('Erro Callback: ' + err.message )  )
    ;

Do jeito que você organizou sua API, terá que tratar inevitavelmente no callback de erro. Porém, se você altera a sua API para retonar true ou false sua vida ficará bem mais fácil.

Aliás, na parte 2 (autenticação) eu verifico se o username já existe, mas não retorno 404, eu retorno true ou false.

Flávio obrigado pela sua resposta. Estou tratando no callback como abaixo. Como a API não é minha, só consumo, vou tratar no Angular mesmo. Está correto a forma que estou utilizando abaixo?

    this.loginPortalService
    .verificaSenhaCadastrada(cpf)
    .subscribe(
      retTemSenha => {
            this.isShowSenha=true;
            this.isShowDataNascimento=false;
            this.retTemSenha = retTemSenha},
      err => {
                this.isShowSenha=false;
                this.isShowDataNascimento=true;
             }  
    ) ;

Se você tiver alguma maneira melhora para tratar, por favor pode me passar.

Muito obrigado pela sua atenção.

Eu tenho sim. Mas não estou no computador agora. Vou tentar digitar pelo smartphone

Se eu não errei nada fica assim:

// os imports
import { map, catchError } from 'rxjs/operators';
import { of, throwError, Observable } from 'rxjs';

    verificaSenhaCadastrada(cpf:string): Observable<boolean> {
        return this
         // precisa export o objeto de resposta com { observe 'response'}
            .http.get<Object[]>('api' + 'verifica-senha-cadastrada/' + cpf, { observe: 'response'})
            // se obteve uma resposta 201, retorna true para dizer que já existe
            .pipe(map(res => true))
  // se der qualwuer erro, cai no catchError. Ele retorna false caso não exista ou relança a exceção 
            .pipe(catchError(err => {
                if(err.status == 404) return of(false);
                throwError(err);
            }));
      }

Repare que agora seu observable retorna true ou false. Dai você saberá se existe ou não. Mas caso o erro seja outro, é relançado outro erro. Você aprenderá uma manobra parecida ao logo dos próximos cursos.

verificaSenhaCadastrada('123')
    .subscribe(exists => {
        console.log(exits);
    });

Caro aluno, Rxjs é poder! :) (você aprenderá esses macetes nos próximos cursos).

Sucesso e bom estudo!