【问题标题】：Angular 2 proper way to template a [routerLink] in a child componentAngular 2在子组件中模板化[routerLink]的正确方法
【发布时间】：2016-11-10 10:14:04
【问题描述】：

我正在尝试在子组件中找到 [routerLink] 模板的方法。

在我的app.component 我有<router-outlet></router-outlet>。

现在，在otherModule.component 内部，我正在尝试应用<a [routerLink]="['home']">Home</a>。

app.module:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';
import { AppComponent } from './app.component';
import {HomeModule} from "../home/home.module";
import {OtherModule} from "../otherModule/otherModule.module";
import {RouterModule} from "@angular/router";
import {routes} from "./routes";

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HomeModule,
    HttpModule,
    OtherModule,
    RouterModule.forRoot(routes)
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

路线：

import {HomeComponent} from "../login/login.component";
import {OtherComponent} from "../clickStudio/clickStudio.component";

export const routes = [
  { path: '', redirectTo: 'home', pathMatch: 'full' },
  { path: 'home', component: HomeComponent },
  { path: 'other', component: OtherComponent },

]

其他组件：

import {Component} from "@angular/core";

@Component({
  selector: 'other',
  template: `<a [routerLink]="['home']">Home</a>`,
  styleUrls: ['./clickstudio-menu.component.scss']
})
export class OtherComponent {

}

我的主要问题是我需要路由 root 路由器而不是子路由

实施此操作的最佳做法是什么？
有什么方法可以保持与 routerLink 的绑定？

【问题讨论】：

“保持与 routerLink 的绑定”是什么意思？
@Lior G 保持绑定到路由器链接是什么意思？你在做什么似乎是正确的。由于您的OtherModule 已添加到导入中，因此OtherComponent 可以访问根路由。 ForRoot() 和 ForChild() 将根路由与子路由分开。通过“angular.io/docs/ts/latest/guide/…”了解更多详情。
我正在尝试将路由器链接绑定到一个变量，以保留通过访问“home”变量并稍后分配它们来添加异步动态路由的选项

标签： javascript angular routes

【解决方案1】：

你试过了吗

<a routerLink="home">Details</a>

或

<a routerLink="/home">Details</a>

【讨论】：

你的两行是一样的。
谢谢，它正在工作，虽然我正在寻找一种方法来保持绑定。