我正在尝试使用ngModule提供程序选项提供服务,但是当我尝试将其添加到我的组件中时,我得到了:没有Servicename的提供程序(此处为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 },name: 'Isabelle Isa' },correlation: 51 },name: 'JulIEn Sergent' },correlation: 39 },name: 'Paul Raul' },correlation: 23 },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.@R_404_6832@',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 ) }}
我看了很多次角度文档,但我没有看到问题,谢谢你的帮助;-)
编辑:当我直接在我的组件中提供服务时,它是有效的,只提供给应用程序模块.
编辑2:我解决了我的问题,这是我的systemJs配置是错误的,或者更确切地说没有设想管理那种情况:我创建了自己的包(Twinipix)但我的应用程序不包含Twinipix文件夹而是公开文件夹,所以问题来自Jspm.config.Js文件:
packages[ "Twinipix" ] = { main: "../public/main.Js"};
我使用该配置进行更多的逻辑导入(导入整个应用程序而不是单个文件),这是我的完美主义者!
因此,使用更常见的systemJs配置,一切都完美无缺!
我解决了我的问题,这是我的systemJs配置错误,或者更确切地说没有设想管理那种情况:我创建了自己的包(Twinipix)但我的应用程序不包含Twinipix文件夹而是公共文件夹,这只是我的完美主义方面!因此,一切都完美无缺!
总结以上是内存溢出为你收集整理的web应用程序 – Angular2 RC5 ngModule:没有NameService的提供者全部内容,希望文章能够帮你解决web应用程序 – Angular2 RC5 ngModule:没有NameService的提供者所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)