angular 2 kann nicht alle Parameter für Service

Question

Ich habe zwei Dienste: LoginService und Userservice und versuchen, Userservice in Loginservice injizieren und die App wird nicht ausgeführt.

in der Konsole, habe ich den Fehler:

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

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

und Userservice:

@Injectable() 
    export class UserService { 
    constructor(private _http: Http , public _ls: 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]

dies mein loginservice ist Winkelmodul:

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 { } 

Answer 1

Sie haben eine Zirkelreferenz.

Ihre UserService erfordert LoginService und LoginService erfordert UserService.

Entfernen Sie eine der Abhängigkeiten. Z.B. Refaktorieren Sie Ihren UserService so, dass kein Verweis auf LoginService erforderlich ist

Answer 2

Da der andere eine zirkuläre Abhängigkeit erwähnt hat, können Sie dieses Problem mithilfe von forwardRef() beheben.

Kurz gesagt, können wir eine Forward-Referenz anstelle des echten Dienstes einfügen. Daher wird die Service-Injektion zurückgestellt. Damit ist die zirkuläre Abhängigkeit gelöst.

Hier ist ein Codebeispiel:

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"; 
    } 
} 

Sie this page für weitere Details überprüfen.