Angular 2 Kein Anbieterfehler

Question

I einfache Starter App erschaffe mit Winkel 2 zu spielen, und ich versuche, einen To-do-Dienst zu machen und ihn zu meiner Komponente zu injizieren und ich bekomme diese Fehlermeldung:

Keinen Anbieter für TodoService ! (TodoList -> TodoService)

TodoService.ts

export class TodoService { 
todos: Array<Object> 
constructor() { 
    this.todos = []; 
} 
} 

app.ts

/// <reference path="typings/angular2/angular2.d.ts" /> 

import {Component, View, bootstrap, For, If} from 'angular2/angular2'; 
import {TodoService} from './TodoService' 

@Component({ 
    selector: 'my-app' 
}) 

@View({ 
    templateUrl: 'app.html', 
    directives: [For, If], 
    injectables: [TodoService] 
}) 

class TodoList { 
todos: Array<Object> 
    constructor(t: TodoService) { 
    this.todos = t.todos 
    } 

    addTodo(todo) { 
    this.todos.push({ 
     done:false, 
     todo: todo.value 
    }); 
    } 
} 

bootstrap(TodoList); 

Was ist das Problem?

Answer 1

Die injizierbaren auf der @Component nicht auf dem @View

angegeben Sie haben:

@Component({ 
    selector: 'my-app' 
}) 

@View({ 
    templateUrl: 'app.html', 
    directives: [For, If], 
    injectables: [TodoService] // moving this line 
}) 

Ändern Sie es an:

@Component({ 
    selector: 'my-app', 
    injectables: [TodoService] // to here 
}) 

@View({ 
    templateUrl: 'app.html', 
    directives: [For, If] 
}) 

Dieser DI es abholen können und injizieren es in Ihre Komponente.

Answer 2

In der neuesten abgewinkelte Ausführung, müssen Sie Anbieter anstelle von injizierbaren, zB:

@Component({ 
    selector: 'my-app', 
    providers: [TodoService] 
})