CODEWITHSUNDEEP
angulartypescript
sqwk
sqwk

Reputation: 2699

Nested Services in Angular 2

When nesting a service into another service in Angular 2 no typescript errors are thrown. However, when the page with the top component is loaded, the following error is logged in the console: EXCEPTION: No provider for ConfigService! (AdminAreaComponent -> CoreService -> ConfigService)

What do I need to do to prevent this?

app.ts:

import {bootstrap} from 'angular2/platform/browser'
import {AdminAreaComponent} from './components/adminArea.component'
var adminArea = bootstrap(AdminAreaComponent);

adminArea.component.ts

import {Component} from 'angular2/core'
import {CoreService} from '../services/core.service'

@Component({
    selector: 'admin-area',
    templateUrl: 'partials/adminArea.html',
    providers: [CoreService]
})
export class AdminAreaComponent {
    constructor(private coreService: CoreService) {}
}

core.service.ts

import {Injectable} from 'angular2/core'
import {ConfigService} from './config.service'

@Injectable()
export class CoreService {
    constructor(private configService : ConfigService) { }
}

config.service.ts

import {Injectable} from 'angular2/core'

@Injectable()
export class ConfigService {
    constructor() { }
}

Upvotes: 4

Views: 2924

Answers (1)

Günter Zöchbauer
Günter Zöchbauer

Reputation: 657118

Seems ConfigService is not listed with the providers in 

bootstrap(AppComponent, [... CoreService, ConfigService])

or in the providers list of the component (if you want to limit the scope of the service) as mentioned by Eric.

Upvotes: 3

Related Questions