角4+：手动重定向路由

Posted 2021-05-03

我最近刚开始使用的，而不是angular.js 1角4。

我跟随英雄教程了解的角4的基本面和我目前采用了棱角分明的自己的“RouterModule”，从“@角/路由器”包。

为了实现一些授权我的应用程序，我想知道如何手动重定向到另一条路，我似乎无法找到关于这个互联网上的任何有用的信息。

答案

角路由：手动导航

首先，你需要导入角路由器：

import {Router} from "@angular/router"

然后注入其在组件的构造函数：

constructor(private router: Router) { }

最后随时随地调用..navigate方法，你需要“重定向”：

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

您还可以设置您的路线上的一些参数，如user/5：

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

文档：Angular official documentaiton

另一答案

重定向在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>   

另一答案

这应该工作

import { Router } from "@angular/router"

export class YourClass{

   constructor(private router: Router) { }

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

}