如何在 Dart 中设置 @RouteConfig答案

【问题标题】：How to setup @RouteConfig in Dart如何在 Dart 中设置 @RouteConfig
【发布时间】：2016-05-04 00:06:12
【问题描述】：

鉴于以下

.ts

@RouteConfig([
  { path: '/',          name: 'root',      redirectTo: ['Home'] },
  { path: '/home',      name: 'Home',      component: HomeComponent },
  { path: '/about',     name: 'About',     component: AboutComponent },
  { path: '/contact',   name: 'Contact',   component: ContactComponent },
  { path: '/protected', name: 'Protected', component: ProtectedComponent },
])

在 dart 中使用相同的代码会产生很多错误。什么是正确的飞镖代码？为列表添加 const 并不能纠正错误

【问题讨论】：

您遇到的错误会很有趣。我只尝试了具体的类而不是地图（new Route(path: ...) 而不是{...}），但看到它提到它也受支持。

标签： dart angular angular2-routing

【解决方案1】：

在 Dart 中你需要引用映射键

{ 'path': '/', 'name': 'root', 'redirectTo': ['Home'] }

【讨论】：

【解决方案2】：

试试

  @RouteConfig( const [
    const Route(path: '/',          name: 'root',      redirectTo: ['Home']),
    const Route(path: '/home',      name: 'Home',      component: HomeComponent),
    const Route(path: '/about',     name: 'About',     component: AboutComponent),
    const Route(path: '/contact',   name: 'Contact',   component: ContactComponent),
    const Route(path: '/protected', name: 'Protected', component: ProtectedComponent)
  ])

来源：Angular Cheat Sheet - dart

【讨论】：

【解决方案3】：

正确的一个（没有Dart不支持的redirectTo）：

@RouteConfig( const [
    const Route(path: '/home',      name: 'Home',      component: HomeComponent, useAsDefault: true),
    const Route(path: '/about',     name: 'About',     component: AboutComponent),
    const Route(path: '/contact',   name: 'Contact',   component: ContactComponent),
    const Route(path: '/protected', name: 'Protected', component: ProtectedComponent)
])

【讨论】：