Кутовий: ручне перенаправлення на маршрут

Нещодавно я почав використовувати angular 4 замість angular.js 1.

Я дотримувався підручника для героїв, щоб дізнатись про основи angular 4, і в даний час я використовую власний "RouterModule" від пакета "@ angular / router".

Для реалізації певної авторизації для моєї програми я хотів би знати, як вручну перенаправити на інший маршрут, я не можу знайти корисну інформацію про це в Інтернеті.

Кутова маршрутизація: ручна навігація

Спочатку потрібно імпортувати кутовий маршрутизатор:

import {Router} from "@angular/router"

Потім вставте його у конструктор компонентів:

constructor(private router: Router) { }

І нарешті, викличте .navigateметод куди завгодно, де вам потрібно "перенаправити":

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

Ви також можете вказати на своєму маршруті деякі параметри, наприклад user/5:

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

Документація: Кутова офіційна документація

Перенаправлення в angularjs 4 Кнопка для події, наприклад: app.home.html

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

та в 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'])
 }
 }

Вам слід ввести маршрутизатор у ваш конструктор так;

constructor(private router: Router) { }

тоді ви можете робити це де завгодно;

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

Кутове перенаправлення вручну: імпортувати @angular/router, вводити, constructor()а потім викликати this.router.navigate().

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

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

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

Спробуйте це:

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

Переспрямування на іншу сторінку за допомогою функції у файлі component.ts ##

   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>   

У вас може бути достатньо правильних відповідей на ваше запитання, але на випадок, якщо ваш IDE дасть вам попередження

Обіцянка, повернута з навігації, ігнорується

Ви можете ігнорувати це попередження або використовувати this.router.navigate(['/your-path']).then().

Це має спрацювати

import { Router } from "@angular/router"

export class YourClass{

   constructor(private router: Router) { }

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

}