Angular 2子路由（v3）'无法读取未定义的属性'注释''答案

【问题标题】：Angular 2 Child Routing (v3) 'Cannot read property 'annotations' of undefined'Angular 2子路由（v3）'无法读取未定义的属性'注释''
【发布时间】：2016-06-28 00:40:17
【问题描述】：

我正在尝试在 Angular 2 中使用并运行一个测试应用程序，但我在让路由在最新版本的路由器 (3.0.0 alpha-7) 中工作时遇到了一些问题。

main.ts:

import {bootstrap}    from '@angular/platform-browser-dynamic';
import {AppComponent} from './app.component';
import {APP_ROUTER_PROVIDERS} from './app.routes';

bootstrap(AppComponent, [APP_ROUTER_PROVIDERS]);

app.component.ts：

import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES} from '@angular/router';

@Component({
    selector: 'my-app',
    template: `
       <router-outlet></router-outlet>
    `,
    directives: [ROUTER_DIRECTIVES]
})
export class AppComponent { }

app.routes.ts：

import {provideRouter, RouterConfig} from '@angular/router';
import {SigninRoutes} from './signin/signin.routes';

export const AppRoutes: RouterConfig = [
    ...SigninRoutes
]

export const APP_ROUTER_PROVIDERS = [
    provideRouter(AppRoutes)
];

signin.component.ts：

import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES} from '@angular/router';

@Component({
    selector: 'signin',
    template: `
        <a [routerLink]="['/signin']">Sign In</a>
        <a [routerLink]="['/profile']">Profile</a>
        <br><br>Sign In Test
        <router-outlet></router-outlet>
    `,
    directives: [ROUTER_DIRECTIVES]
})

export class SigninComponent {

}

signin.routes.ts：

import {Component} from '@angular/core';
import {ROUTER_DIRECTIVES} from '@angular/router';

@Component({
    selector: 'signin',
    template: `
        <a [routerLink]="['/signin']">Sign In</a>
        <a [routerLink]="['/profile']">Profile</a>
        <br><br>Sign In Test
        <router-outlet></router-outlet>
    `,
    directives: [ROUTER_DIRECTIVES]
})

export class SigninComponent {

}

profile.component.ts:

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

@Component ({
    selector: 'profile',
    template: `
        Profile Test
    `

})

export class ProfileComponent {

}

由于某种原因，我可以正常启动应用程序，但尝试单击配置文件 routerLink 会导致错误：

“异常：错误：未捕获（承诺中）：TypeError：无法读取未定义的属性'注释'”

如果有人能帮我解决这个问题，将不胜感激。

【问题讨论】：

您的路线看起来如何？
请显示你的路线我有同样的错误：P

标签： javascript typescript angular angular2-routing

【解决方案1】：

听起来像：

https://github.com/angular/angular/issues/9414

类似问题：

检查常见错误：

确保您的路线的path 中没有/
确保每条路线都有component、redirectTo、children之一
确保将路由中使用的组件正确导入到定义路由的文件中

【讨论】：

【解决方案2】：

我在使用 webpack 并尝试像这样异步加载路由时遇到了这个错误：

{
 path: 'password', loadChildren: () => new Promise(resolve => {
   (require as any).ensure([], require => {
     resolve(require('./password/password.module').PasswordModule);
   });
 })
},

上面的代码没有错，但是看看我以为我正在加载的模块：

@NgModule({
imports: [
 CommonModule,
 ...
],
declarations: [
  ...
],
providers: [
 ...
]
})
export class LockedModule {}  // wrong name !!!!

注意模块的名称 LockedModule，它应该是 PasswordModule。我偶然发现了这个，我花了一段时间才找到。我不经常滚动到底部并验证导出名称，调试窗口没有提示我这是原因。

【讨论】：