Entrar Ainda não tem acesso?
3
respostas

Como identificar "alterações" nos parâmetros das rotas, mesmo sem eles mudarem ?

Referente ao curso Angular parte 1: produtividade e organização com framework SPA

por Allan Dantas dos Santos
| 2.2k xp | 5 posts

Olá !

Referente ao processo para identificar alterações nos parâmetros das rotas, meu componente realiza a mudança dos parâmetros quando eu clico em um botão, deste modo:

this.router.navigate(['/busca/TODOS/' + this.codRastreio]);

Dentro do ngOnInit(), eu me inscrevi no evento de alterações dos parâmetros da rota para chamar uma função caso os mesmos sejam alterados:

ngOnInit() {
     this.route.params.subscribe(params => {
        this.params = params;
              this.getData();
        });
}

O código funciona normalmente, se eu clicar no botão os parâmetros mudam e a função getData é executada. Porém minha dúvida é a seguinte, caso os parâmetros continuem os mesmos eu ainda sim quero executar a função 

this.getData();

Porém o params.subscribe() só vai ser executado se o parâmetro efetivamente mudar, se continuar o mesmo ele não é executado. Então agora quando clico no botão antes de mudar os parâmetros da rota eu realizo uma verificação para ver se os parâmetros mudaram ou se continuam o mesmo:

if(this.params['cod'] == this.codRastreio){
      this.getData();
}else{
      this.router.navigate(['/tracking/TODOS/' + this.codRastreio]);
 }

Gostaria de saber se esta é a solução mais adequada para este problema em questão.

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

Fala aí Allan, beleza? Já ajudei um aluno com o mesmo problema.

Você pode utilizar o .events.subscribe do ActivatedRoute.

Espero ter ajudado.

por Allan Dantas dos Santos
| 2.2k xp | 5 posts

Bom dia Matheus,

Apliquei o código

this.route.events.subscribe(params => {
      this.params = params;
      this.getData();
 });

porém obtive o seguinte erro

Property 'events' does not exist on type 'ActivatedRoute'.

veja que no construtor do componente faço a injeção do ActivatedRoute

constructor(private geralService: GeralService,
    private router: Router, private route: ActivatedRoute,
    private service: TrackingService, public fn: Functions) {
    super(service, fn);
}

Sei que existe o .events.subscribe para o objeto Router porém não funciona como no params.subscribe do objeto ActivatedRoute

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

Fala aí Allan, o .events é do Router e não do ActivatedRoute, é só trocar no seu ngOnInit:

this.router.events.subscribe(event => {
    if (event instanceof NavigationEnd) {
        this.getData()
        this.params = event
    }
 })

Dai eu esqueci de comentar, na sua declaração das rotas precisa passar uma configuração:

RouterModule.forRoot(routes, { onSameUrlNavigation: 'reload' })

Veja que passei o onSameUrlNavigation, agora é possível pegar o evento até quando navegar para a mesma rota.

Espero ter ajudado.