Angular2 RC5 ngModule: Brak dostawcy usług NameService

Question

Mam mały (duży ...) problem z usługami angle2. Próbuję dostarczać usługi z opcjami dostawcy ngModule, ale kiedy próbuję dostać to do moich składników dostałem: Brak dostawcy dla ServiceName (tutaj, RankingService).

app.module.ts

import { NgModule }   from '@angular/core' 
import { BrowserModule } from '@angular/platform-browser' 
import { FormsModule }  from '@angular/forms' 
import { HttpModule }  from '@angular/http' 

/* 
* App component and routing 
*/ 
import { AppComponent } from './components/app/app.component' 
import { routing }  from './app.routes' 

/* 
* Services 
*/ 
import { UserService }  from './services/user.service' 
import { RankingService } from './services/ranking.service' 

/* 
* Global components 
*/ 
import { HeaderComponent } from './components/header/header.component' 
import { FooterComponent } from './components/footer/footer.component' 

/* 
* App Components 
*/ 
import { RankingComponent }  from './components/ranking/ranking.component' 
import { OthersComponent }  from './components/others/others.component' 
import { IpixsComponent }  from './components/ipix/ipixs.component' 
import { IpixDetailsComponent } from './components/ipix/ipix-details/ipix-details.component' 

@NgModule({ 
    imports: [ 
     BrowserModule, 
     FormsModule, 
     HttpModule, 
     routing 
    ], 
    declarations: [ 
     AppComponent, 
     HeaderComponent, 
     FooterComponent, 
     RankingComponent, 
     OthersComponent, 
     IpixsComponent, 
     IpixDetailsComponent 
    ], 
    providers: [ 
     UserService, 
     RankingService 
    ], 
    exports: [ AppComponent ], 
    bootstrap: [ AppComponent ] 
}) 
export class AppModule { } 

ranking.service.ts

import { Injectable } from '@angular/core' 

/* 
* Entities 
*/ 
import { RankingUser } from './../entities/ranking-user' 

@Injectable() 
export class RankingService { 
    getRanking() { 
     const users: RankingUser[] = [ 
      { user: { picture : '', name: 'Edwige Chou' }, correlation: 100 }, 
      { user: { picture : '', name: 'Mathieu Vandeginste' }, correlation: 78 }, 
      { user: { picture : '', name: 'Isabelle Isa' }, correlation: 51 }, 
      { user: { picture : '', name: 'Julien Sergent' }, correlation: 39 }, 
      { user: { picture : '', name: 'Paul Raul' }, correlation: 23 }, 
      { user: { picture : '', name: 'Johnatan' }, correlation: 17 } 
     ] 

     return users 
    } 
} 

ranking.component.ts

/* 
* Dependencies 
*/ 
import { Component, OnInit } from '@angular/core' 

/* 
* Services 
*/ 
import { RankingService } from './../../services/ranking.service' 

/* 
* Entities 
*/ 
import { RankingUser } from './../../entities/ranking-user' 

@Component({ 
    moduleId: module.id, 
    selector: 'ranking', 
    templateUrl: 'ranking.component.html', 
    styleUrls: [ 'ranking.component.css' ] 
}) 
export class RankingComponent implements OnInit { 
    ranking: RankingUser[] 

    constructor(
     private rankingService: RankingService 
    ) { } 

    ngOnInit() { 
     this.getRanking() 
    } 

    getRanking() { 
     this.ranking = this.rankingService.getRanking() 
     console.log(this.ranking) 
    } 
} 

Spoglądałem wiele razy na kanciasty dokument, ale nie widzę problemu, dziękuję za pomoc ;-)

Edycja: Gdy dostarczam usługę bezpośrednio w moich komponentach, to działa, tylko dostarcz go do modułu aplikacji. t.

Edycja 2: Rozwiązałem mój problem, to była moja konfiguracja systemu, która była błędna, lub raczej nie została stworzona do zarządzania taką sytuacją: Stworzyłem własny pakiet (Twinipix), ale moja aplikacja nie zawiera Twinipix Folder ale raczej folderu publicznego, więc problem był z jspm.config.js pliku:

packages[ "Twinipix" ] = { 
    main: "../public/main.js" 
}; 

użyłem tej konfiguracji zrobić import bardziej logiczne (importować całą aplikację, a nie pojedynczy plik), to Juste my perfekcjonista bok! Tak więc, z bardziej powszechną konfiguracją systemjs, wszystko działa idealnie!

Answer 1

Odpowiedział Pytający pytanie:

mi rozwiązać mój problem, to była moja konfiguracja systemjs co było źle, albo raczej nie stworzone do zarządzania tego rodzaju sytuacji: Stworzyłem własną paczkę (Twinipix), ale moja aplikacja nie zawiera Twinipix folder, ale raczej folderu publicznego, więc problem był z jspm.config.js pliku:

packages[ "Twinipix" ] = { 
    main: "../public/main.js" 
}; 

użyłem tej konfiguracji zrobić import bardziej logiczne (importować całą aplikację, a nie jeden plik), to tylko moja perfekcjonistyczna strona! Tak więc, przy bardziej powszechnej konfiguracji systemu, wszystko działa idealnie!