Angular 2无法解析服务

时间:2017-06-05 14:50:38

标签: angular service inject

我有两个服务:LoginService和UserService。我试图将UserService注入LoginService并且应用程序不会运行。

在控制台中,我有错误:

  

错误:无法解析UserService的所有参数:([object Object],   ?)。在SyntaxError.ZoneAwareError   (http://localhost:4200/polyfills.bundle.js:7156:33)at   SyntaxError.BaseError [as constructor]

这是我的LoginService:

import {UserService} from '../services/user.service';
@Injectable()
export class LoginService {

  constructor(public _http: Http,public us:UserService) {
  }

和UserService:

 @Injectable()
    export class UserService {
    constructor(private _http: Http , public _ls: LoginService) {

    }

角度模块:

import {LoginService} from './services/login.service';
import {UserService} from './services/user.service';

@NgModule({
  declarations: [
    AppComponent,


  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,

  ],
  exports: [BrowserModule, SlimLoadingBarModule],
  providers: [UserService, LoginService, appRoutingProviders],
  bootstrap: [AppComponent]
})
export class AppModule { }

2 个答案:

答案 0 :(得分:29)

你有一个循环引用。

您的UserService需要LoginServiceLoginService需要UserService

删除其中一个依赖项。例如。重构您的UserService,以便它不需要对LoginService的引用

答案 1 :(得分:3)

正如其他帖子提到的循环依赖...您可以考虑使用forwardRef()来解决此问题。

简而言之,我们可以注入Forward Reference而不是真实服务。因此服务注入将被推迟。因此,循环依赖性得到了解决。

以下是代码示例:

import {Component, Inject, forwardRef} from '@angular/core';

@Component({
  selector: 'my-app',
  template: '<h1>Favourite framework: {{ name }}</h1>'
})
class AppComponent {
  name: string;

  constructor(@Inject(forwardRef(() => NameService)) nameService) {
    this.name = nameService.getName();
  }
}

class NameService {
  getName () {
    return "Angular";
  }
}

您可以查看this page了解详情。