Angular 2 无法解析服务的所有参数
Angular 2 can't resolve all parameters for service
我有两个服务:LoginService 和 UserService。我正在尝试将 UserService 注入到 LoginService 中,但该应用不会 运行。
在控制台中,我有错误:
Error: Can't resolve all parameters for UserService: ([object Object],
?). at SyntaxError.ZoneAwareError
(http://localhost:4200/polyfills.bundle.js:7156:33) at
SyntaxError.BaseError [as constructor]
这是我的登录服务:
import {UserService} from '../services/user.service';
@Injectable()
export class LoginService {
constructor(public _http: Http,public us:UserService) {
}
和用户服务:
@Injectable()
export class UserService {
constructor(private _http: Http , public _ls: LoginService) {
}
angular模块:
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 { }
你有一个循环引用。
您的 UserService
需要 LoginService
,LoginService
需要 UserService
。
删除其中一个依赖项。例如。重构您的 UserService,使其不需要引用 LoginService
正如其他帖子提到的循环依赖...您可以考虑使用 forwardRef()
来解决此问题。
简而言之,我们可以注入一个前向引用而不是真正的服务。所以服务注入将被推迟。这样循环依赖就解决了
这是一个代码示例:
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 了解更多详情。
我有两个服务:LoginService 和 UserService。我正在尝试将 UserService 注入到 LoginService 中,但该应用不会 运行。
在控制台中,我有错误:
Error: Can't resolve all parameters for UserService: ([object Object], ?). at SyntaxError.ZoneAwareError (http://localhost:4200/polyfills.bundle.js:7156:33) at SyntaxError.BaseError [as constructor]
这是我的登录服务:
import {UserService} from '../services/user.service';
@Injectable()
export class LoginService {
constructor(public _http: Http,public us:UserService) {
}
和用户服务:
@Injectable()
export class UserService {
constructor(private _http: Http , public _ls: LoginService) {
}
angular模块:
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 { }
你有一个循环引用。
您的 UserService
需要 LoginService
,LoginService
需要 UserService
。
删除其中一个依赖项。例如。重构您的 UserService,使其不需要引用 LoginService
正如其他帖子提到的循环依赖...您可以考虑使用 forwardRef()
来解决此问题。
简而言之,我们可以注入一个前向引用而不是真正的服务。所以服务注入将被推迟。这样循环依赖就解决了
这是一个代码示例:
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 了解更多详情。