无法解析AuthenticationService的所有参数：（[object object]，？，[object Object]）

Question

我遇到了下一个错误，无法理解如何解决它。

无法解决所有参数的AuthenticationService：（？[目标对象]，[目标对象]）

我检查了几乎所有的话题在这里，并尝试多种方式来解决它但仍然无法在第二天打败它。

我试图注入第一authService在AppService服务像

@Inject(forwardRef(() => AuthenticationService)) public authService: AuthenticationService 

我都检查过了DI和内部服务的进口秩序这一点，但得到同样的错误，在我看来，一切是正确的

所以我很感激有人能帮我解决这个问题。

角4.0.0

AuthService

import { Injectable } from '@angular/core'; 
import {Http, Headers, Response} from '@angular/http'; 
import 'rxjs/add/operator/toPromise'; 
import {Observable} from 'rxjs/Rx'; 

import {AppServices} from "../../app.services"; 
import {Router} from "@angular/router"; 

@Injectable() 
export class AuthenticationService { 
    public token: any; 

    constructor(
    private http: Http, 
    private appService: AppServices, 
    private router: Router 
) { 
    this.token = localStorage.getItem('token'); 
    } 

    login(username: string, password: string): Observable<boolean> { 
    let headers = new Headers(); 
    let body = null; 
    headers.append("Authorization",("Basic " + btoa(username + ':' + password))); 

    return this.http.post(this.appService.api + '/login', body, {headers: headers}) 
     .map((response: Response) => { 
     let token = response.json() && response.json().token; 
     if (token) { 
      this.token = token; 
      localStorage.setItem('Conform_token', token); 
      return true; 
     } else { 
      return false; 
     } 
     }); 
    } 

    logout(): void { 
    this.token = null; 
    localStorage.removeItem('Conform_token'); 
    this.router.navigate(['/login']); 
    } 
} 

应用服务

import {Injectable} from '@angular/core'; 
import {Headers, Http, RequestOptions} from '@angular/http'; 
import {Router} from "@angular/router"; 
import {AuthenticationService} from "./auth/auth.service"; 

import 'rxjs/add/operator/toPromise'; 
import {Observable} from 'rxjs/Rx'; 

@Injectable() 

export class AppServices { 

    api = '//endpoint/'; 

    public options: any; 
    constructor(
    private http: Http, 
    private router: Router, 
    public authService: AuthenticationService // doesn't work 
    // @Inject(forwardRef(() => AuthenticationService)) public authService: AuthenticationService // doesn't work either 
    ) { 
     let head = new Headers({ 
     'Authorization': 'Bearer ' + this.authService.token, 
     "Content-Type": "application/json; charset=utf8" 
    }); 
    this.options = new RequestOptions({headers: head}); 
    } 

    // ==================== 
    // data services 
    // ==================== 

    getData(): Promise<any> { 
    return this.http 
     .get(this.api + "/data", this.options) 
     .toPromise() 
     .then(response => response.json() as Array<Object>) 
     .catch((err)=>{this.handleError(err);}) 
    } 

APP模块

import { BrowserModule } from '@angular/platform-browser'; 
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; 

import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import {BaseRequestOptions, HttpModule} from '@angular/http'; 

import { MaterialModule} from '@angular/material'; 
import {FlexLayoutModule} from "@angular/flex-layout"; 
import 'hammerjs'; 

import { routing, appRoutingProviders } from './app.routing'; 
import { AppServices } from './app.services'; 
import {AuthGuard} from "./auth/auth.guard"; 
import {AuthenticationService} from "./auth/auth.service"; 

import {AppComponent} from './app.component'; 
import {AuthComponent} from './auth/auth.component'; 
import {NotFoundComponent} from './404/not-found.component'; 
import { HomeComponent } from './home/home.component'; 

@NgModule({ 
    declarations: [ 
    AppComponent, 
    AuthComponent, 
    NotFoundComponent, 
    HomeComponent 
    ], 
    imports: [ 
    BrowserModule, 
    BrowserAnimationsModule, 
    FormsModule, 
    HttpModule, 
    routing, 
    MaterialModule, 
    FlexLayoutModule 
    ], 
    providers: [AppServices, AuthGuard, AuthenticationService], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

Answer 1

您有AppServices一个之间的循环依赖关系d AuthenticationService - 对于像Angular这样的构造函数注入来说，这是不可能的。

要解决，你可以使用

export class AuthenticationService { 
    public token: any; 
    appService: AppServices; 
    constructor(
    private http: Http, 
    // private appService: AppServices, 
    injector:Injector; 
    private router: Router 
) { 
    setTimeout(() => this.appService = injector.get(AppServices)); 
    this.token = localStorage.getItem('token'); 
    } 

参见DI with cyclic dependency with custom HTTP and ConfigService

为了避免setTimeout您还可以设置AuthenticationService.appService从AppService构造（或者反过来）