In this lesson, we’re going to take a look at how add a class to the providers property of a component creates an actual providers. We’ll learn what a provider specifically does and how we can provide different dependencies with the same token.
import {Component} from ‘angular2/core‘;
import {TodoService} from ‘./../services/TodoService‘;
@Component({
selector: ‘todos‘,
providers: [TodoService],
template: `
<div>
<ul>
<li *ngFor="#todo of todoService.todos
{{todo.name}}
</li>
</ul>
</div>
`
})
export class TodoList implements OnInit{
todos: Array<any>
constructor(private todoService: TodoService){}
ngOnInit(){
this.todos = this.todoService.getTodos();
}
}
export class TodoService { todos = [ {id: 0, name: "eat"}, {id: 1, name: "sleep"}, {id: 2, name: "running"}, ]; getTodos(){ return this.todos; } }
Here we use providers, which tell Angular, we want to use TodoService, create a instance for us, and so that we can use the instance.
providers: [TodoService],
Actually, this is shorthard syntax, you can do:
providers: [
{ provider: TodoService, useClass: TodoService}
],
Here need to make sure, "provider" ‘s token are the same use "userClass", if you change "userClass" to some other service, it will still use the "TodoService":
providers: [ { provide: TodoService, useClass: OtherService} // still use TodoService instead ],
To recap importing a data really just makes the type available, but doesn‘t give us an instance. In order to inject objects, we need providers that know how to create these objects by a given token which is a type.
[Angular 2] 5. Inject Service with "Providers"
原文：http://www.cnblogs.com/Answer1215/p/5876999.html