Winkel: Manuelle Umleitung zur Route

Ich habe erst kürzlich angefangen, Angular 4 anstelle von Angular.js 1 zu verwenden.

Ich habe das Helden-Tutorial befolgt, um mehr über die Grundlagen von Angular 4 zu erfahren, und verwende derzeit das Angular-eigene "RouterModule" aus dem "@ Angular / Router" -Paket.

Um eine Autorisierung für meine Anwendung zu implementieren, möchte ich wissen, wie man manuell zu einer anderen Route umleitet. Ich kann im Internet keine nützlichen Informationen dazu finden.

Winkelführung: Manuelle Navigation

Zuerst müssen Sie den Winkelrouter importieren:

import {Router} from "@angular/router"

Fügen Sie es dann in Ihren Komponentenkonstruktor ein:

constructor(private router: Router) { }

Rufen Sie die .navigateMethode schließlich an einer beliebigen Stelle auf, an der Sie "umleiten" müssen:

this.router.navigate(['/your-path'])

Sie können auch einige Parameter auf Ihrer Route setzen, wie user/5:

this.router.navigate(['/user', 5])

Dokumentation: Angular offizielle Dokumentation

Umleitung in anglejs 4 Schaltfläche für Ereignis in z. B.: App.home.html

<input type="button" value="clear" (click)="onSubmit()"/>

und in home.componant.ts

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

 @Component({
   selector: 'app-root',
   templateUrl: './app.home.html',
 })

 export class HomeComponant {
   title = 'Home';
   constructor(
     private router: Router,
    ) {}

  onSubmit() {
    this.router.navigate(['/doctor'])
 }
 }

Sie sollten Router wie folgt in Ihren Konstruktor einfügen.

constructor(private router: Router) { }

dann können Sie dies tun, wo immer Sie wollen;

this.router.navigate(['/product-list']);

Winkelumleitung manuell: Importieren @angular/router, Injizieren und constructor()dann aufrufen this.router.navigate().

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

constructor(private router: Router) {
  ...
}

onSubmit() {
  ...
  this.router.navigate(['/profile']); 
}

Versuche dies:

constructor(  public router: Router,) {
  this.route.params.subscribe(params => this._onRouteGetParams(params));
}
this.router.navigate(['otherRoute']);

Mit der Funktion in der Datei component.ts ## auf eine andere Seite umleiten

   componene.ts-
   ------------------------------------------------------------------------  
   import {Router} from '@angular/router';

   constructor(private router: Router) {}

   OnClickFunction()
   {
        this.router.navigate(['/home']);
   }

  component.html-
  ----------------------------------------------------------------------------------- 

     <div class="col-3">                  
         <button (click)="OnClickFunction()" class="btn btn-secondary btn-custom mr- 
          3">Button Name</button>
    </div>   

Möglicherweise haben Sie genügend richtige Antworten auf Ihre Frage, aber falls Ihre IDE Sie warnt

Von der Navigation zurückgegebenes Versprechen wird ignoriert

Sie können diese Warnung entweder ignorieren oder verwenden this.router.navigate(['/your-path']).then().

Das sollte funktionieren

import { Router } from "@angular/router"

export class YourClass{

   constructor(private router: Router) { }

   YourFunction() {
      this.router.navigate(['/path']);
   }

}