Nested Services in Angular 2

Question

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() { }
}

If you're interested in knowing why Eric's and Günter's answers work: http://stackoverflow.com/questions/35582613/angular2-inject-into-injectable/35582685#35582685 — Thierry Templier, Feb 24 '16 at 14:59
So in order to get rid of all errors I should import the relevant services and define their providers in multiple files? — sqwk, Feb 24 '16 at 15:06
I had a similar problem yesterday. Check out [this](http://stackoverflow.com/questions/35582613/angular2-inject-into-injectable) question. — Radoslav Stoyanov, Feb 24 '16 at 20:47

score 3 · Accepted Answer · answered Feb 24 '16 at 14:56

3

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.

answered Feb 24 '16 at 14:56

Günter Zöchbauer

623,577
216
2,003
1,567

3

Shouldn't each service be able to define its own components? If they must be listed globally, wouldn't that make Angular 2 not very modular? – Peder Rice Mar 02 '16 at 23:11
I also think this should be improved. See also http://stackoverflow.com/a/35756813/217408 – Günter Zöchbauer Mar 03 '16 at 04:16

Nested Services in Angular 2

1 Answers1