ERRORエラー：ルーターのプロバイダがありません！ at injectionError（core.es5.js：1231）[角]

Question

このエラーが発生しています。私のangularJS 2アプリケーションは今のところ小さいです。私はAngularJSが初めてです。助けてください！事前にありがとう。 app.module.ts

import { BrowserModule } from '@angular/platform-browser'; 
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 
import { NgModule } from '@angular/core'; 
import { HttpModule } from '@angular/http'; 
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; 
import { MaterialModule } from '@angular/material'; 

dashboard.module.ts

import { ToolbarMultirow } from './toolbar-multirow'; 
import { DashboardComponent } from './dashboard/dashboard.component'; 
import { DashboardService } from './dashboard/shared/dashboard.service'; 
import { DashboardModule } from './dashboard/dashboard.module'; 

@NgModule({ 
    imports: [ 
    BrowserModule, 
    BrowserAnimationsModule, 
    FormsModule, 
    HttpModule, 
    ReactiveFormsModule, 
    MaterialModule, 
    DashboardModule 
    ], 
    declarations: [ 
    ToolbarMultirow, 
    // DashboardComponent 
    ], 
    providers: [ 
    DashboardService 
    ], 
    bootstrap: [ 
    ToolbarMultirow, 
    DashboardComponent 
    ], 
}) 
export class AppModule { } 

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; 
import { RouterModule } from '@angular/router'; 
import { HttpModule } from '@angular/http'; 

import { DashboardComponent } from './dashboard.component'; 
import { DashboardService } from './shared/dashboard.service'; 

@NgModule({ 
    imports: [ 
    CommonModule, 
    FormsModule, 
    ReactiveFormsModule, 
    HttpModule 
    ], 
    declarations: [ 
    DashboardComponent 
    ], 
    exports: [ 
     DashboardComponent, 
     CommonModule, 
     FormsModule 
    ], 
    providers: [ 
    // DashboardService 
    ], 
    bootstrap: [ 
    // DashboardComponent 
    ] 
}) 
export class DashboardModule { } 

DashboardComponent_Host.html:1 ERROR CONTEXT DebugContext_ {view: Object, nodeIndex: 1, nodeDef: Object, elDef: Object, elView: Object} View_DashboardComponent_Host_0 @ DashboardComponent_Host.html:1 proxyClass @ compiler.es5.js:13572 DebugContext_.logError @ core.es5.js:12953 ErrorHandler.handleError @ core.es5.js:1149 (anonymous) @ core.es5.js:4660 ZoneDelegate.invoke @ zone.js:365 onInvoke @ core.es5.js:4125 ZoneDelegate.invoke @ zone.js:364 Zone.run @ zone.js:125 (anonymous) @ zone.js:760 ZoneDelegate.invokeTask @ zone.js:398 onInvokeTask @ core.es5.js:4116 ZoneDelegate.invokeTask @ zone.js:397 Zone.runTask @ zone.js:165 drainMicroTaskQueue @ zone.js:593 zone.js:569 Unhandled Promise rejection: No provider for Router! ; Zone: ; Task: Promise.then ; Value: Error: No provider for Router! at injectionError (core.es5.js:1231) [angular] at noProviderError (core.es5.js:1269) [angular] at ReflectiveInjector_.throwOrNull (core.es5.js:2770) [angular] at ReflectiveInjector.getByKeyDefault (core.es5.js:2809) [angular] at ReflectiveInjector.getByKey (core.es5.js:2741) [angular] at ReflectiveInjector.get (core.es5.js:2610) [angular] at AppModuleInjector.NgModuleInjector.get (core.es5.js:3557) [angular] at resolveDep (core.es5.js:10930) [angular] at createClass (core.es5.js:10799) [angular] at createDirectiveInstance (core.es5.js:10627) [angular] at createViewNodes (core.es5.js:11977) [angular] at createRootView (core.es5.js:11882) [angular] at callWithDebugContext (core.es5.js:13013) [angular] at Object.debugCreateRootView [as createRootView] (core.es5.js:12474) [angular] Error at injectionError (http://localhost:4200/vendor.bundle.js:2025:86) [angular] at noProviderError (http://localhost:4200/vendor.bundle.js:2063:12) [angular] at ReflectiveInjector_.throwOrNull (http://localhost:4200/vendor.bundle.js:3564:19) [angular] at ReflectiveInjector.getByKeyDefault (http://localhost:4200/vendor.bundle.js:3603:25) [angular] at ReflectiveInjector.getByKey (http://localhost:4200/vendor.bundle.js:3535:25) [angular] at ReflectiveInjector.get (http://localhost:4200/vendor.bundle.js:3404:21) [angular] at AppModuleInjector.NgModuleInjector.get (http://localhost:4200/vendor.bundle.js:4351:52) [angular] at resolveDep (http://localhost:4200/vendor.bundle.js:11724:45) [angular] at createClass (http://localhost:4200/vendor.bundle.js:11593:32) [angular] at createDirectiveInstance (http://localhost:4200/vendor.bundle.js:11421:37) [angular] at createViewNodes (http://localhost:4200/vendor.bundle.js:12771:49) [angular] at createRootView (http://localhost:4200/vendor.bundle.js:12676:5) [angular] at callWithDebugContext (http://localhost:4200/vendor.bundle.js:13807:42) [angular] at Object.debugCreateRootView [as createRootView] (http://localhost:4200/vendor.bundle.js:13268:12) [angular] consoleError @ zone.js:569 handleUnhandledRejection @ zone.js:574 _loop_1 @ zone.js:609 drainMicroTaskQueue @ zone.js:613 zone.js:571 Error: Uncaught (in promise): Error: No provider for Router! Error at injectionError (core.es5.js:1231) [angular] at noProviderError (core.es5.js:1269) [angular] at ReflectiveInjector_.throwOrNull (core.es5.js:2770) [angular] at ReflectiveInjector.getByKeyDefault (core.es5.js:2809) [angular] at ReflectiveInjector.getByKey (core.es5.js:2741) [angular] at ReflectiveInjector.get (core.es5.js:2610) [angular] at AppModuleInjector.NgModuleInjector.get (core.es5.js:3557) [angular] at resolveDep (core.es5.js:10930) [angular] at createClass (core.es5.js:10799) [angular] at createDirectiveInstance (core.es5.js:10627) [angular] at createViewNodes (core.es5.js:11977) [angular] at createRootView (core.es5.js:11882) [angular] at callWithDebugContext (core.es5.js:13013) [angular] at Object.debugCreateRootView [as createRootView] (core.es5.js:12474) [angular] at injectionError (core.es5.js:1231) [angular] at noProviderError (core.es5.js:1269) [angular] at ReflectiveInjector_.throwOrNull (core.es5.js:2770) [angular] at ReflectiveInjector.getByKeyDefault (core.es5.js:2809) [angular] at ReflectiveInjector.getByKey (core.es5.js:2741) [angular] at ReflectiveInjector.get (core.es5.js:2610) [angular] at AppModuleInjector.NgModuleInjector.get (core.es5.js:3557) [angular] at resolveDep (core.es5.js:10930) [angular] at createClass (core.es5.js:10799) [angular] at createDirectiveInstance (core.es5.js:10627) [angular] at createViewNodes (core.es5.js:11977) [angular] at createRootView (core.es5.js:11882) [angular] at callWithDebugContext (core.es5.js:13013) [angular] at Object.debugCreateRootView [as createRootView] (core.es5.js:12474) [angular] at resolvePromise (zone.js:712) [] at :4200/polyfills.bundle.js:3326:17 [] at :4200/polyfills.bundle.js:3342:33 [] at Zone.run (zone.js:125) [ => ] at :4200/polyfills.bundle.js:3448:57 [] at Zone.runTask (zone.js:165) [ => ] at drainMicroTaskQueue (zone.js:593) [] consoleError @ zone.js:571 handleUnhandledRejection @ zone.js:574 _loop_1 @ zone.js:609 drainMicroTaskQueue @ zone.js:613

Answer 1

ただ輸入にRouterModuleを追加します。

import { NgModule } from '@angular/core'; 
import { CommonModule } from '@angular/common'; 
import { FormsModule, ReactiveFormsModule } from '@angular/forms'; 
import { RouterModule } from '@angular/router'; 
import { HttpModule } from '@angular/http'; 

import { DashboardComponent } from './dashboard.component'; 
import { DashboardService } from './shared/dashboard.service'; 

@NgModule({ 
imports: [ 
    RouterModule, <------- 
    CommonModule, 
    FormsModule, 
    ReactiveFormsModule, 
    HttpModule 
], 
declarations: [ 
    DashboardComponent 
], 
exports: [ 
    DashboardComponent, 
    CommonModule, 
    FormsModule 
], 
providers: [ 
    // DashboardService 
], 
bootstrap: [ 
    // DashboardComponent 
] 
}) 
export class DashboardModule { }