¿Cómo redirigir a una nueva página en Angular 4 haciendo clic en el botón?

Solución:

Prueba esto

<button (click)="router.navigate(['/master']);">
   <span>Go to master Page</span>
</button>

O

en tu casa.html

<button (click)="goToPage('master')">
   <span>Go to master Page</span>
</button>

y en el componente de tu hogar

import { Router } from '@angular/router';

constructor(private router: Router){
}

function goToPage(pageName:string){
  this.router.navigate([`${pageName}`]);
}

Estoy de acuerdo con Veena K. Suresh en su solución, una navegación a través de un evento de clic, pero también puede pasar datos a través del mismo truco.

1. importar el router module int su componente actual como:

import { Router } from '@angular/router';

2. inyectarlo a tu constructor

constructor(
    private router: Router
  ) { }

3. el recién agregado al ancla en el que desea usarlo

<a (click)="router.navigate(['/search',search.value]);" class="search-area__icon"> 
    <i class="la la-search"></i>
</a>

navigateByUrl siempre espera una URL absoluta.

i.e. router.navigateByUrl("/team/33/user/11");

Si desea proporcionar una ruta relativa, puede utilizar navigate en lugar de:

router.navigate(['team', 33, 'user', 11], {relativeTo: route});

---

---

Utiliza Nuestro Buscador