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

Erro no switchMap

Erro "

Argument of type '(userName: any) => void' is not assignable to parameter of type '(value: any, index: number) => ObservableInput<{}>'. Type 'void' is not assignable to type 'ObservableInput<{}>' "

import { Injectable } from "@angular/core";
import { AbstractControl } from "@angular/forms";

import { SignUpService } from "./signup.service";
import { debounceTime, switchMap, map , first} from "rxjs/operators";
import { Observable } from "rxjs";


@Injectable({ providedIn: 'root'})
export class UserNotTakenValidatorService {
    constructor(private signUpService: SignUpService){}


    checkUserNameTaken(){

        return (control: AbstractControl) => {

            return control
            .valueChanges
            .pipe(debounceTime(300))
            .pipe(switchMap(userName: => {
                    this.signUpService.checkUserNameTaken(userName);
                }
            ))
            .pipe(map(isTaken => isTaken ? { checkUserNameTaken: true}: null))
            .pipe(first());

        }
    } 
}
8 respostas

Fala aí Felipe, tudo bem? Acho que o problema está ocorrendo porque seu switchMap não está retornando informação, tente mudar para:

.pipe(switchMap(userName: =>
    this.signUpService.checkUserNameTaken(userName)
))

Basicamente foi removido as chaves para que seja retornado o valor para o próximo .pipe.

Espero ter ajudado.

Após a mudança sugerida o erro persiste

ERROR in src/app/home/signup/user-not-taken.validator.service.ts(21,29): error TS2345: Argument of type '(userName: any) => void' is not assignable to parameter of type '(value: any, index: number) => ObservableInput<{}>'. Type 'void' is not assignable to type 'ObservableInput<{}>'

Felipe olhando o seu código, o erro parece ser uma sintaxe errada:

Vc esta usando "userName: =>" (dois pontos)

.pipe(switchMap(userName:  => {
                    this.signUpService.checkUserNameTaken(userName);
                }
            ))

O correto e "userName =>":

 .pipe(switchMap(userName =>
        this.singUpService.checkUserNameTaken(userName)
))

Agradeço o aucilio Flavio mas não deu certo

Infelizmente ja avia tentado a forma sugerida sem dar certo.

os " : " estavam ali pos tinha tentado tipar a variavel para corrigir o erro, e na hora de retornar ao codigo anteriar ficou ali sem querer.

De qualquer forma, ja tentei de farias formas inclusive a sugerida e continuo com o mesmo erro.

Atualmente o codigo esta da seguinte forma e ainda com erro

import { Injectable } from "@angular/core";
import { AbstractControl } from "@angular/forms";

import { SignUpService } from "./signup.service";
import { debounceTime, switchMap, map, first } from "rxjs/operators";
import { Observable } from "rxjs";


@Injectable()
export class UserNotTakenValidatorService {
    constructor(private signUpService: SignUpService){}


    checkUserNameTaken(){

        return (control: AbstractControl) => {

            return control
            .valueChanges
            .pipe(debounceTime(300))
            .pipe(switchMap(
                userName => this.signUpService.checkUserNameTaken(userName)             
                ))
            .pipe(map(isTaken => isTaken ? { userNameTaken: true }: null))
            .pipe(first());

        }
    } 

}

Fala Felipe;

Da uma olhada no meu projeto do Alura PIC no GIT:

https://github.com/flaviossantana/angular-alurapic/blob/master/src/app/home/signup/user-not-taken.validator.service.ts

Quem sabe te ajuda.

Felipe, consegue compartilhar o seu projeto? Está no Github? Me manda o link.

Fico no aguardo.

solução!

Achei o erro. na verdade estava no metodo checkUserNameTaken que nao estava retornando nada.

Boa Felipe, fico feliz que tenha resolvido.

Irei marcar o tópico como solucionado para que possa ajudar outros alunos.

Abraços e bons estudos.

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