Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

sobre os operadores do rxjs e a api

Referente ao curso Angular parte 2: Autenticação, Forms e lazy loading, no capítulo O componente para login e atividade Projeto da aula

por Lucas Ventavele Ribeiro
| 59.3k xp | 24 posts

Após receber o resultado do input no formulário de registro devemos retornar nulo se o nome de usuário pode ser usado ou um objeto com o valor configurado para true se já estiver em uso. Porém não estou entendendo muito bem o método pipe, switchMap e map. 

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());
        }
    }

No método do signupService também gostaria de saber o que ele retorna. Ele faz uma requisição http com o método get para a api no backend, certo. Porém, essa rota user/exists eu acredito que ela não exista como a api faz para receber isso?

    checkUserNameTaken(userName: string) {
        return this.http.get(API + '/user/exists/' + userName)
    }
3 respostas
solução!
por Matheus Henrique Castiglioni
| 5307.1k xp | 9007 posts
Instrutor Senior Software Engineer

Fala ai Lucas, tudo bem? Vamos lá:

Porém não estou entendendo muito bem o método pipe, switchMap e map.

  • pipe: A função pipe é usada para encadear uma série de passos que devem ser processados em nossos Observable's. Imagine o pipe como uma sequência de funções, onde, o retorno da função anterior será o parâmetro do pipe.
  • map: O map é usado para modificar algum dado no Observable atual, no caso seu Observable possuí um booleano isToken e você está modificando o valor do Observable para um objeto.
  • switchMap: O switchMap possuí uma funcionalidade semelhante ao map, porém, a diferença é que ele vai devolver um novoObservableem vez de modificar o valor doObservable` atual.

No método do signupService também gostaria de saber o que ele retorna. Ele faz uma requisição http com o método get para a api no backend, certo

O método checkUserNameTaken vai retornar um Observable, isso porque a função get retorna esse tipo.

Porém, essa rota user/exists eu acredito que ela não exista como a api faz para receber isso?

Essa rota existe na API, no caso do front não é necessário que a mesma existe, quem precisa conhecer essa rota é apenas o back.

Espero ter ajudado.

por Lucas Ventavele Ribeiro
| 59.3k xp | 24 posts

Obrigado Matheus, aparentemente o rxjs tem bastante operadores para estudar. O pipe se assemelharia ao then de promises então né? Ele pega o valor anterior como parâmetro e vai passando adiante também. Achei o conceito de promises mais fácil de entender do que o de Obseravables.

por Matheus Henrique Castiglioni
| 5307.1k xp | 9007 posts
Instrutor Senior Software Engineer

Magina Lucas, sempre que precisar não deixe de criar suas dúvidas.

Sim, a RXJS é muito extensa, eu mesmo após trabalhar e mexer bastante com Angular ainda não vi tudo.

Basicamente o pipe é semelhante ao then sim, realmente trabalhar com Observable's é mais complexo do Promise, afinal, eles são bem mais poderosos.

Abraços e bons estudos.