Muitas duvidas..

Fala ai Nícolas, tudo bem? Vamos lá:

Aqui já n consigo ver muita lógica nesse código, eu peguei uma instancia de NavigationEnd, e na segunda linha eu dou um map passando NADA, e retorno this.activatedRoute

Nesse ponto você está retornando o activatedRoute, que foi declarado como propriedade da classe:

private activatedRoute: ActivatedRoute

Nesse caso, a próxima chamada do pipe terá acesso ao conteúdo do activatedRoute.

se em algum momento da aplicação n tivesse um NavigationEnd, existe essa possibilidade?

Não, mas, ele faz o filtro para saber quando houve a navegação, isso porque existe vários evento que podem ser disparados para o .events.subscribe, então, ele faz o filtro para verificar se o processo de navegação terminou.

esse route é o retorno de this.activatedRoute

Sim, nesse ponto o route é o retorno de this.activatedRoute.

e por que o professor fala pra subir na hierarquia de firstChild? dei um console log pra ver o que retorna, e não fez muito sentido na minha cabeça, alguém poderia me dar um help?

Foi necessário pegar o firstChild, pois, a rota atual deveria ser o AppComponent e a definição do data não está nele, mas, sim nas rotas filhas (AppComponent é o pai de todas).

Por isso ele pegou o firstChild e depois o data. O firstChild nada é mais do que um atalho para:

route.children[0].data.subscribe(data => console.log(data.title))

Espero ter ajudado.

tirou quase todas, só continuo com duvida no pq que tem um while(route.firstChild) route = route.firstChild; return route;

Exemplo, atualmente estou em AppComponent, quando dou route.firstChild eu vou pra onde?

no caso da home ele tem essas rotas

{
    path: '',
    component: HomeComponent,
    canActivate: [LoginGuard],
    children: [
      {
        path: '', 
        component: SigninComponent,
        data: {
          title: 'Sig in'
        }
      },
      {
        path: 'signup',
        component: SignupComponent,
        data: {
          title: 'Sign up'
        }
      }
    ]
  },
];

ai estou em AppComponent, dou firstChild e caio em SigninComponent?

e quando mudo de rota ele esquece o firstChild Sign e muda para Signup?

n vejo isso no log, no log aparece pra mim component vazio ou undefined

Opa, vamos lá:

Exemplo, atualmente estou em AppComponent, quando dou route.firstChild eu vou pra onde?

No caso, se você fizer o teste, vai ver que a rota atual será seu componente AppComponent, mas, você precisa navegar até o componente que de fato foi renderizado nessa rota.

Por isso usa o firstChild.

ai estou em AppComponent, dou firstChild e caio em SigninComponent?

Exatamente, isso mesmo.

e quando mudo de rota ele esquece o firstChild Sign e muda para Signup?

Quando você muda a rota o primeiro filho passar a ser o SignupComponent.

Se você quiser visualizar isso no log, tente mudar seu código para:

this.router.events
    .pipe(filter(event => event instanceof NavigationEnd))
    .pipe(map(() => this.activatedRoute))
        .pipe(map(route => {
        while(route.firstChild) {
            console.log(route.component)
            route = route.firstChild;
        }
        return route;
    }))
    .pipe(switchMap((route => route.data)))
    .subscribe(event => this.titleService.setTitle(event.title));

Isso deve mostrar mais informações.

Espero ter ajudado.