Angular 正在多次构造的服务

我有一个针对Azure AD进行身份验证的服务，然后调用WS来获取该用户的角色。我希望该服务作为整个应用程序中引用的单例，但我注意到每次构造新组件时，该服务也是如此

Main.browser.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { decorateModuleRef } from './app/environment';
import { bootloader } from '@angularclass/hmr';
import { AppModule } from './app';

export function main(): Promise<any> {
  return platformBrowserDynamic()
.bootstrapModule(AppModule)
.then(decorateModuleRef)
.catch(err => console.error(err));
}

bootloader(main);

import { NgModule, ApplicationRef } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';
import { SharedModule } from './shared.module';
import { ErrorHandler } from '@angular/core';
import { ENV_PROVIDERS } from './environment';
import { ROUTES } from './app.routes';
import { App } from './app.component';
import { APP_RESOLVER_PROVIDERS } from './app.resolver';
import { AppState, InteralStateType } from './app.service';
import { AppConfig } from './app.config';
import { ErrorComponent } from './error/error.component';
import { AuthGuard } from './authentication/authentication.guard';
import { GlobalExceptionHandler } from './app.error.ts';

//This is the service that I am having issues with
import { AuthContext } from './authentication/auth-context.service';
/////////////////////////////////////

const APP_PROVIDERS = [
    ...APP_RESOLVER_PROVIDERS,
    AppState,
    AppConfig,
    AuthGuard,
    AuthContext
];

type StoreType = {
    state: InteralStateType,
    restoreInputValues: () => void,
    disposeOldHosts: () => void
};

@NgModule({
    bootstrap: [
        App
    ],
    declarations: [
        App,
        ErrorComponent
    ],
    imports: [ // import Angular's modules
        BrowserModule,
        FormsModule,
        HttpModule,
        RouterModule.forRoot(ROUTES, { useHash: true }),
        SharedModule.forRoot()
    ],
    providers: [ // expose our Services and Providers into Angular's     dependency injection
        ENV_PROVIDERS,
        APP_PROVIDERS,
        { provide: ErrorHandler, useClass: GlobalExceptionHandler }
    ]
})
export class AppModule {
    constructor(public appRef: ApplicationRef, public appState: AppState) {                }
}

import { Injectable } from '@angular/core'
import { Component, ViewEncapsulation } from '@angular/core';
import { AppState } from './app.service';
import { AuthContext } from './authentication/auth-context.service';

@Component({
    selector: 'app',
    encapsulation: ViewEncapsulation.None,
    styleUrls: [
        './scss/application.scss'
    ],
    template: `<router-outlet></router-outlet>`
})
@Injectable()
export class App {
    authContext: AuthContext;
    constructor(
        public appState: AppState, ctx: AuthContext) {
        this.authContext = ctx;
        this.authContext.handleWindowCallback();
    }

    ngOnInit() {
    }
}

应用程序组件.ts

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { decorateModuleRef } from './app/environment';
import { bootloader } from '@angularclass/hmr';
import { AppModule } from './app';

export function main(): Promise<any> {
  return platformBrowserDynamic()
.bootstrapModule(AppModule)
.then(decorateModuleRef)
.catch(err => console.error(err));
}

bootloader(main);

import { NgModule, ApplicationRef } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';
import { SharedModule } from './shared.module';
import { ErrorHandler } from '@angular/core';
import { ENV_PROVIDERS } from './environment';
import { ROUTES } from './app.routes';
import { App } from './app.component';
import { APP_RESOLVER_PROVIDERS } from './app.resolver';
import { AppState, InteralStateType } from './app.service';
import { AppConfig } from './app.config';
import { ErrorComponent } from './error/error.component';
import { AuthGuard } from './authentication/authentication.guard';
import { GlobalExceptionHandler } from './app.error.ts';

//This is the service that I am having issues with
import { AuthContext } from './authentication/auth-context.service';
/////////////////////////////////////

const APP_PROVIDERS = [
    ...APP_RESOLVER_PROVIDERS,
    AppState,
    AppConfig,
    AuthGuard,
    AuthContext
];

type StoreType = {
    state: InteralStateType,
    restoreInputValues: () => void,
    disposeOldHosts: () => void
};

@NgModule({
    bootstrap: [
        App
    ],
    declarations: [
        App,
        ErrorComponent
    ],
    imports: [ // import Angular's modules
        BrowserModule,
        FormsModule,
        HttpModule,
        RouterModule.forRoot(ROUTES, { useHash: true }),
        SharedModule.forRoot()
    ],
    providers: [ // expose our Services and Providers into Angular's     dependency injection
        ENV_PROVIDERS,
        APP_PROVIDERS,
        { provide: ErrorHandler, useClass: GlobalExceptionHandler }
    ]
})
export class AppModule {
    constructor(public appRef: ApplicationRef, public appState: AppState) {                }
}

import { Injectable } from '@angular/core'
import { Component, ViewEncapsulation } from '@angular/core';
import { AppState } from './app.service';
import { AuthContext } from './authentication/auth-context.service';

@Component({
    selector: 'app',
    encapsulation: ViewEncapsulation.None,
    styleUrls: [
        './scss/application.scss'
    ],
    template: `<router-outlet></router-outlet>`
})
@Injectable()
export class App {
    authContext: AuthContext;
    constructor(
        public appState: AppState, ctx: AuthContext) {
        this.authContext = ctx;
        this.authContext.handleWindowCallback();
    }

    ngOnInit() {
    }
}

最后是应用程序的子组件，它为我的服务触发构造函数

import { Component, ViewEncapsulation } from '@angular/core';
import { AuthContext } from './../authentication/auth-context.service';


@Component({
    selector: 'users',
    templateUrl: './users.template.html',
    encapsulation: ViewEncapsulation.None,
    styleUrls: ['./users.style.scss'],
})
export class UsersComponent {
constructor(config: AppConfig,
    private ctx: AuthContext,
) {
    ctx.handleWindowCallback();
}

我知道我做了一些错误的引导，但我遵循了所有的演练，我可以找到一个T。有人看到什么吗