Navegação Programática no Angular

É possível navegar por URLs não apenas com links, mas também dentro do código JavaScript, usando comandos específicos.

Isso é feito usando o serviço Router. Vamos ver como trabalhar com ele. Primeiro, importe-o:

app/app.component.tsimport { Router } from "@angular/router";

Agora, vamos injetá-lo no componente através de injeção de dependência:

app/app.component.tsexport class AppComponent {
  constructor(private router: Router) {
  
  }
}

O serviço possui um método navigate, que navega para um URL especificado. Vamos usar este método:

app/app.component.tsexport class AppComponent {
  constructor(private router: Router) {
  
  }
  
  go() {
    this.router.navigate(['/aaaa/']);
  }
}

E agora, vamos chamar o método go ao clicar em um botão:

app/app.component.html<button (click)="go()">btn</button>