Question

我正在尝试使用routerlink从一个页面重定向到另一个页面，我尝试了以下代码，

我有以下路线作为我的网址

http://localhost:3000/#/app/dashboard

当我点击此

时，我想重定向到此

  [routerLink]=" ['tables/basic'] "

http://localhost:3000/#/app/tables/basic

但它会

http://localhost:3000/#/app/dashboard/tables/basic

此处应移除仪表板，我该怎么办？任何人都可以提供一些帮助吗？

my routes.ts，

import { Routes } from '@angular/router';
import { ErrorComponent } from './error/error.component';


export const ROUTES: Routes = [{
   path: '', redirectTo: 'app', pathMatch: 'full'
  }, {
    path: 'app',   loadChildren: () => System.import('./layout/layout.module')
  }, {
    path: 'login', loadChildren: () => System.import('./login/login.module')
  }, {
    path: 'error', component: ErrorComponent
  }, {
    path: '**',    component: ErrorComponent
  }
];

Answer 1

也许

[routerLink]="['../tables/basic']"

或

[routerLink]="['/app/tables/basic']"

确保您需要提供有关您的应用程序已配置的路由以及包含[routerLink]

的组件的信息

Answer 2

如果要通过单击按钮进行路由，则可以轻松地使用它，也可以将其用作组件中的参数解析器。首先，我将介绍如何将其用作唯一的路由。

 <a [routerLink]="['/user/complain']">complain</a>

在上面的示例中，我们可以使用 complain 标签

路由用户/投诉

现在我将描述第二个（如何通过组件解析参数）

我将使用路由器参数完成

<a [routerLink]="['/user/complain', job.id]">complain</a>

由此我们可以解析 job.id 来投诉组件。

在投诉component.ts文件中-

export class ComplainComponent {

  id: number;
  private sub: any;

  constructor(private route: ActivatedRoute) { }

  ngOnInit() {
    this.sub = this.route.params.subscribe(params => {
      this.id = params['id']; // (+) converts string 'id' to a number


   });

  }

}

我们可以在此文件中为路由器参数分配一个变量。然后通过投诉component.html文件，您可以轻松地通过

<h3>{{job.id}}</h3>

如何在angular2中使用routerlink？

2 个答案: