2016-08-24 40 views
1

私は、角のルーティングリンクを作成しようとしていたときに、このエラーを取得しておいてください。角度2 RC5テンプレートのパースエラー

zone.js:461 Unhandled Promise rejection: Template parse errors: 
Can't bind to 'routerLink' since it isn't a known property of 'a'. (" 
</h1> 
<button (click)="doLogin()">Login</button> 
<a [ERROR ->][routerLink]="['/createservice']" href="#">Post a Service</a> 
<router-outlet></router-outlet> 
"): [email protected]:3 ; Zone: <root> ; Task: Promise.then ; Value: BaseExceptionconsoleError @ zone.js:461 
zone.js:463 Error: Uncaught (in promise): Template parse errors:(…) 

これは私のコードです:

<a [routerLink]="['/createservice']" href="#">Post a Service</a> 

と私のコンポーネントで、私はこれを持っている:

import { RouterLink } from '@angular/router'; 

@Component({ 
    moduleId: module.id, 
    selector: 'app-root', 
    providers: [AngularFire], 
    templateUrl: 'app.component.html', 
    styleUrls: ['app.component.css'], 
    directives: [RouterLink] 
}) 

は私もこれを試してみましたこのチュートリアル(https://angular.io/docs/ts/latest/guide/router.html#!#router-link)に続いて

<a routerLink="/createservice" routerLinkActive="active">Post a Service</a> 

のいずれかが動作しません。

これは私が私のアプリをブートストラップしています方法です:

@NgModule({ 
    imports: [ 
    BrowserModule, 
    AngularFireModule.initializeApp(firebaseConfig), 
    RouterModule, 
    routing 
    ], 
    declarations: [ AppComponent, CreateServiceComponent ], 
    providers: [ appRoutingProviders ], 
    bootstrap: [ AppComponent,FIREBASE_PROVIDERS ] 
}) 
export class MyAppModule {} 

if (environment.production) { 
    enableProdMode(); 
} 

bootstrap(AppComponent, [ 
    FIREBASE_PROVIDERS, 
    defaultFirebase(firebaseConfig), 
    firebaseAuthConfig({ 
    provider: AuthProviders.Facebook, 
    method: AuthMethods.Popup 
})]); 
+0

どのangular2バージョンをお使いですか? –

+0

私はrc5を使用しています。 – Tyler

+0

@NgModuleを使用していますか?あなたのアプリケーションをどのようにブートストラップしているのかを投稿してください。 – j2L4e

答えて

1

あなたは[routerLink]を使用するには、directives: [RouterLink]を含める必要はありません。これは、RouterModule.forRoot経由で行う設定で利用できます。

@NgModule({ 
    ... 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    RouterModule.forRoot(<route paths and configurations>) 
    ], 
    .... 
}) 

任意のフィーチャモジュールでは、RouterModuleを追加して明示的にインポートする必要があります。

これが役立ちますように!

+0

私は既にこのエクスポートconst routing = RouterModule.forRoot(appRoutes)を持っています。 app.routes.tsの内部 – Tyler

関連する問題