Angular 2:Routerlink在头部组件中不起作用

时间:2016-08-25 12:35:07

标签: angular

我有一个RC5应用程序,其中包含以下设置:

main.ts:

// Dynamic (JIT) compiler
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

// Our main app module
import { AppModule } from './app.module';

// Compile and launch the module
platformBrowserDynamic().bootstrapModule(AppModule);

app.module.ts:

@NgModule({
  imports: [BrowserModule, routing, SharedModule.forRoot()],
  declarations: [AppComponent, ErrorComponent],
  bootstrap: [AppComponent]
})
export class AppModule {}

shared.module.ts:

@NgModule({
    imports: [CommonModule, HttpModule],
    declarations: [TranslatePipe, DateToStringPipe, HeaderComponent],
    exports: [TranslatePipe, DateToStringPipe, CommonModule, FormsModule, ReactiveFormsModule, HeaderComponent]
})

export class SharedModule {

    static forRoot(): ModuleWithProviders {

        return {
            ngModule: SharedModule,
            providers: [
                FeedbackService,
                CookieService,
                AuthService,
                LoggerService,
                RouteGuard,
                {
                  provide: TranslateLoader,
                  useFactory: (http: Http) => new TranslateStaticLoader(http, 'app/languages', '.json'),
                  deps: [Http]
                },
                TranslateService,
                SearchService,
                SharedComponent,
                HeaderComponent
            ]
        };

    }

}

@NgModule({
    exports: [SharedModule],
    providers: []
})
export class SharedRootModule {}

我使用<router-outlet></router-outlet>来显示应用程序中的每个模块,它运行正常。

但我不能在HeaderComponent内使用“routerlink”。如果我将标记移动到我的AppComponent它是有效的,所以没有标记问题。

<router-outlet>内加载的所有其他组件都可以使用“routerlink”。

我对HeaderComponent做错了什么?

1 个答案:

答案 0 :(得分:2)

RouterLink不属于CommonModule但属于Angular的RouterModule,您必须先导入该模块才能使用它。