2016-06-28 8 views
4

私はAngular 2で遊んで、テストアプリを稼働させようとしていますが、最新バージョンのルータ(3.0.0 alpha-7)。Angular 2 Child Routing(v3) '未定義の'プロパティの注釈 'を読み取ることができません。

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例外:未定義のプロパティを読み取ることができません 『注釈』」

誰も私を助けることができる場合のwiこれは大いに感謝しています。

+0

あなたのルートはどのように見えますか? –

+0

あなたのルートを表示してください。私は同じエラーがあります:P – Elisabeth

答えて

1

のように聞こえる:

同様の問題:

を一般的なエラーのため

チェック:

  • あなたのルートのpath
  • /を持っていないことを確認し、すべてのルートがcomponentの1、redirectTochildren
  • を持っていることを確認したルートで使用される構成要素であることを確認ルートが定義されているファイルに正しくインポートされました
1

このエラーはwebpackを使用していて、電子そう:その後、

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

上記のコードには何もありませんが、私は、私はロードだと思ったモジュールを見て:モジュールの名前、LockedModuleが、それはPasswordModuleあるべき

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

注意してください。私はこれにつまずいたし、見つけるのにはしばらくかかった。非常に頻繁に私は一番下までスクロールして、エクスポート名とデバッグウィンドウが原因であることを知らせなかったことを確認します。

関連する問題