Tucker
Tucker

Reputation: 7362

Angular2 simple DI not working

I have the following angular2 app with a simple dependency injected and it doesn't work. What am I missing?

Here's the error:

EXCEPTION: Cannot resolve all parameters for 'AppComponent'(?). Make sure that all the parameters are decorated with Inject or have valid type annotations and that 'AppComponent' is decorated with Injectable.

and the code:

import {Component} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';

class DataService {
    items: Array<any>;

    constructor() {
        this.items = [
            { name: 'Christoph Burgdorf' },
            { name: 'Pascal Precht' },
            { name: 'thoughtram' }
        ];
    }

    getItems() {
        return this.items;
    }
}


@Component({
    selector: 'app',
    providers: [DataService],
    template: `
    <ul>
      <li *ngFor="#item of items">{{item.name}}</li>
    </ul>
  `
})
class AppComponent {
    items: Array<any>;
    constructor(dataService: DataService) {
        this.items = dataService.getItems();
    }
}

bootstrap(AppComponent, []);

Upvotes: 1

Views: 84

Answers (1)

G&#252;nter Z&#246;chbauer
G&#252;nter Z&#246;chbauer

Reputation: 657356

Can't reproduce. I added your code to a Plunker

https://plnkr.co/edit/0DTjG5?p=preview

and it seems to work fine with or without @Injectable().

It is suggested to always add @Injectable() to services but it is only required when the service has constructor parameters.

.

Upvotes: 1

Related Questions