首页 文章

SubRoutes与rc1角度路由器

提问于
浏览 次
1

我正在尝试使用rc1版本重写angular的路由器 . 我有一个具有子路由器的功能组，并使用非终端路由定义它，如下所示：

{ path: '/contacts/...', component: ContactsComponent}

但如果我尝试这样导航：

<a [routerLink]="['/contacts']"></a>

它说：“无法匹配任何路线 . 当前段：'联系人' . 可用路线：['/ dashboard'，'/ contacts / ...']”

如果我试图将/ contacts / ...传递给路由器链接 - 它会突然开始工作，但在URL的末尾也会有“...” . 因此，我得出的结论是，可能不再需要“......”，所以我重写了这样的路线：

{ path: '/contacts', component: ContactsComponent}

所以现在我的contacts组件被加载了，但我在ContactsComponent中定义了以下子路由：

{ path: '/group/:id', component: GroupComponent }

和路由器链接：

<a [routerLink]="['./group', {id: group.id}]">{{ group.name }}</a>

哪个不适用于以下错误：

Cannot match any routes. Current segment: 'group;id=1'. Available routes: ['/', '/group/:id']

我也尝试了路由器链接，如“/ group”和“/ contacts / group”，它们都不起作用 .

有谁知道如何使用rc1路由器进行非终端路径的子路由？

angular angular2-routing

2 回答

  • 1

    我假设你的网址是这样的： /contacts/group/5 将id 5传递给contacts组件子路由中的group组件 . 正确的路线是从内部相对于子组件，即组ID 5的 ./group/5 .

    我使用一种方法来工作，如the sample中的the sample：

    onSelect(crisis: Crisis) {
  // Relative link would be `./groups/${group.id}` in your case
  this.router.navigate([`./${crisis.id}`], this.currSegment);
}

    但是虽然没有记录，但您可以将值作为第二个数组元素而不是对象传递 . 在这里单击数字导航与onSelect（）并单击名称使用 routerLink （plnkr）

    <!-- [routerLink]="['./', group.id]"> -->
  <li *ngFor="let crisis of crises"
    <span class="badge" (click)="onSelect(crisis)">{{crisis.id}}</span> 
    <a [routerLink]="['./', crisis.id]">{{crisis.name}}</a>
  </li>
    回复于
  • 0

    我认为重点在于它正在努力

    你可以尝试这样的事情

    <a [routerLink]="getLink()">{{ group.name }}</a>

getLink() {
  return [`group/${group.id}`]
}

    我希望这有帮助

    回复于

相关问题