angular - 如何在 Dart 上的 Angular 2 中使用参数嵌套 2 个或更多路由级别

Question

我有一个用 Dart 编写的 Angular 2 应用程序，它有多个带参数的嵌套路由。

最高级别的路由有一个参数“category”并且工作完美:

@RouteConfig(const [
  const Route(path: '/', name: 'Empty', component: Empty, useAsDefault: true),
  const Route(path: '/categories/:category/...', name: 'Category', component: Category)
])
class AppComponent { /* Content omitted */ }

HTML:

<a [routerLink]="['Category', {'category': cat['id']}]">{{cat['name']}}</a>

Category 还有一个 RouteConfig，它定义了参数“product”:

@RouteConfig(const [
  const Route(path: '/', name: 'Empty', component: Empty, useAsDefault: true),
  const Route(path: '/products/:product', name: 'Product', component: Product)
])
class Category { /* Content omitted */ }

当我尝试创建指向这样的产品的链接时:

<a [routerLink]="['Category/Product', {'category': id, 'product': product['id']}]">{{product['name']}}</a>

我收到以下错误:

Route generator for 'category' was not included in parameters passed.

我还在链接中尝试了 Product 和 ./Product，这两种方法都导致了以下错误:

Component "AppComponent" has no route named "Product".

我已将完整源代码推送到Github:https://github.com/stijnvanbael/angular2-demo

Answer 1

这可能会满足您的要求:

<a [routerLink]="['/Category', {'category': id}, 'Product', {'product': product['id']}]">{{product['name']}}</a>