Comment créer une redirection simple en cliquant sur un bouton dans Angular 2? Déjà essayé:
import {Component, OnInit} from 'angular2/core';
import {Router, ROUTER_PROVIDERS} from 'angular2/router'
@Component({
selector: 'loginForm',
templateUrl: 'login.html',
providers: [ROUTER_PROVIDERS]
})
export class LoginComponent implements OnInit {
constructor(private router: Router) { }
ngOnInit() {
this.router.navigate(['./SomewhereElse']);
}
}
Vous pouvez utiliser le support d’événement d’Angle2:
@Component({
selector: 'loginForm',
template: `
<div (click)="redirect()">Redirect</div>
`,
providers: [ROUTER_PROVIDERS]
})
export class LoginComponent implements OnInit {
constructor(private router: Router) { }
redirect() {
this.router.navigate(['./SomewhereElse']);
}
}
Je le rendrais plus dynamique en utilisant des paramètres de méthode
Importer le routeur angulaire
import { Router } from '@angular/router';
Créer un bouton avec événement click
<div (click)="redirect(my-page)">My page</div>
Créer une méthode avec un paramètre pagename
redirect(pagename: string) {
this.router.navigate(['/'+pagename]);
}
Lorsque vous cliquez dessus, le routeur doit se diriger vers la bonne page
Je dirais que la directive routerLink
est utilisée et placée sur la balise a
(ancre)
<a [routerLink]="['./SomewhereElse']">Redirect</a>
Aussi, vous devez supprimer Assurez-vous que ROUTER_PROVIDERS
de providers
& l'inclure dans la dépendance de bootstrap, puis ajouter l'option ROUTER_DIRECTIVES
in directives du composant pour utiliser la directive routerLink
en HTML.RouterModule
avec son itinéraire a été injecté dans le module principal de l'application.
Essayez la balise de bouton routerLink
on
<button type="button" [routerLink]="['/edit']">Edit</button>
window.location.reload (); fait le tour