Angular no provider for NameService

You have to use providers instead of injectables

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

Complete code sample here.

In Angular 2 there are three places you can "provide" services:

1. bootstrap
2. root component
3. other components or directives

"The bootstrap provider option is intended for configuring and overriding Angular's own preregistered services, such as its routing support." -- reference

If you only want one instance of NameService across your entire app (i.e., Singleton), then include it in the providers array of your root component:

@Component({   providers: [NameService],   ...)}export class AppComponent { ... }

Plunker

If you would rather have one instance per component, use the providers array in the component's configuration object instead:

@Component({   providers: [NameService],   ...)}export class SomeOtherComponentOrDirective { ... }

See the Hierarchical Injectors doc for more info.

As of Angular 2 Beta:

Add @Injectable to your service as:

@Injectable()export class NameService {    names: Array<string>;    constructor() {        this.names = ["Alice", "Aarav", "Martín", "Shannon", "Ariana", "Kai"];    }    getNames() {        return this.names;    }}

and to your component config add the providers as:

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