Angular: Chuyển hướng thủ công đến tuyến đường

Tôi vừa mới bắt đầu sử dụng angle 4 thay vì angle.js 1.

Tôi đã làm theo hướng dẫn về anh hùng để tìm hiểu về các nguyên tắc cơ bản của angle 4 và hiện tôi đang sử dụng "RouterModule" của riêng angle từ gói "@ angle / router".

Để thực hiện một số ủy quyền cho ứng dụng của mình, tôi muốn biết cách chuyển hướng thủ công sang một tuyến đường khác, tôi dường như không thể tìm thấy bất kỳ thông tin hữu ích nào về điều này trên internet.

Định tuyến theo góc: Điều hướng thủ công

Trước tiên, bạn cần nhập bộ định tuyến góc:

import {Router} from "@angular/router"

Sau đó, đưa nó vào hàm tạo thành phần của bạn:

constructor(private router: Router) { }

Và cuối cùng gọi .navigatephương thức ở bất kỳ đâu bạn cần "chuyển hướng":

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

Bạn cũng có thể đặt một số thông số trên tuyến đường của mình, như user/5:

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

Tài liệu: Angular documentaiton

Chuyển hướng trong anglejs 4 Nút cho sự kiện trong ví dụ: app.home.html

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

và trong 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'])
 }
 }

Bạn nên đưa Router vào hàm tạo của mình như thế này;

constructor(private router: Router) { }

thì bạn có thể làm điều này ở bất cứ đâu bạn muốn;

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

Chuyển hướng góc theo cách thủ công: Nhập @angular/router, Chèn vào constructor()rồi gọi this.router.navigate().

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

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

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

Thử đi:

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

Chuyển hướng đến một trang khác bằng hàm trên tệp 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>   

Bạn có thể có đủ câu trả lời đúng cho câu hỏi của mình nhưng trong trường hợp IDE của bạn đưa ra cảnh báo

Lời hứa trả về từ điều hướng bị bỏ qua

bạn có thể bỏ qua cảnh báo đó hoặc sử dụng this.router.navigate(['/your-path']).then().

Điều này sẽ hoạt động

import { Router } from "@angular/router"

export class YourClass{

   constructor(private router: Router) { }

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

}