角度4.3 - サービスクラッシュのコンストラクタでルータを開始

Question

この問題は私の心を揺さぶっています。私は非常にシンプルなものが欠けていると確信しています。私は私のコンポーネントにTestAuthServiceを追加するまで、ここで

は私home.component.tsある

import { Component, OnInit } from '@angular/core'; 
import { AuthService } from './../../services/auth/auth.service' 
import { TestAuthService } from './../../services/auth/testauth.service' 

@Component({ 
    selector: 'app-home', 
    templateUrl: './home.component.html', 
    styleUrls: ['./home.component.css'], 
    providers: [AuthService, TestAuthService] 
}) 
export class HomeComponent implements OnInit { 

    constructor(public authService: TestAuthService) 
    { 
    // authService.login(); 
    } 

    ngOnInit() { 
    } 

    loginClick() { 
    this.authService.login(); 
    } 

} 

すべてが完全に表示されます。現在、メインのAuthServiceは使用されていません。インポートを削除するかどうかは何もしません。ここで

がtestauth.service.ts

import { Injectable } from '@angular/core'; 
import { Router } from '@angular/router'; 
import 'rxjs/add/operator/filter'; 
import * as auth0 from 'auth0-js'; 

@Injectable() 
export class TestAuthService { 
    auth0 = new auth0.WebAuth({ 
     clientID: 'clientIdKeyString', 
     domain: 'legitemail.auth0.com', 
     responseType: 'token id_token', 
     audience: 'https://legitemail.auth0.com/userinfo', 
     redirectUri: 'http://localhost:4200/callback',  
     scope: 'openid' 
     }); 

     constructor(**private router: Router**) {} 

     public login(): void { 
     this.auth0.authorize(); 
     } 

} 

ですこれは、私はそれは私の.angular-cli.jsonファイルで参照されている

npm install --save auth0-js 

を使用してNPMを通じてインストールauth0を使用しています。このコードは、auth0の認証ページに正しくリダイレ​​クトされ、コールバックURLにリダイレクトされるログインボタンがあるので、コンストラクタが空のときにこのコードが確実に機能することがわかります。しかし、ルータをコンストラクタに含めると、私の画面全体がクラッシュします（私は動作していない部分を太字にしました）。

ルータをコンストラクタに追加すると、ページ全体がどのように読み込まれないかがわかりません。繰り返しになりますが、私がそれを動作させるために変更する唯一のことは、私のコンストラクタで太字のパラメータのRouterを削除することです。

エラーがある：

ng:///AppModule/AppComponent.ngfactory.js:7 ERROR Error: No provider for Router! 

Answer 1

解決JB Nizetからのコメントを述べてきたよう

、RouterModuleメインNgModuleに含まれなければならない

app.module.ts

が追加されました

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

その後、私の輸入

imports: [ 
    BrowserModule, 
    BrowserAnimationsModule, 
    AppMaterialModule, 
    RouterModule.forRoot([]) 
],