无法解析可注入服务的参数

Question

我有一个Angular2项目2.0.0，在试图加载该项目时，浏览器中出现了以下错误：

误差

Metadata_Resolver.js:508未捕获错误：无法解析CustomerService:(AngularFireDatabase,？,Token_FirebaseApp)的所有参数。(…)CompileMetadataResolver.getDependenciesMetadata@metadata_Resolver.js:508CompileMetadata_Resolver.getTypeMetadata@metadata_Resolver.js:508CompileMetadata_Resolver.js:405（匿名函数）ompiler._compileComponents@runtime_compiler.js:126runtime_compiler._compilemoduleandcomponents@runtime_compiler.js:64runtime_compiler.compilemoduleasys@runtime_compiler.js:55platformref_._bootstrapmoduleWith zone@application_ref.js:303platformref_.bootstrapmodule:285（匿名函数）2webpackjsonpcallback@bootstrap 138 b 37 d…:23（匿名函数）@main.bundle。JS：1

客户服务

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

import { Observable, Subject } from "rxjs/Rx";

import { FirebaseRef, AngularFireDatabase, FirebaseListObservable } from 'angularfire2';

import "rxjs/add/operator/filter";

import { Customer } from "./customer-model";
import { AuthenticationService } from '../authentication/authentication.service';

declare var firebase: any;

@Injectable()
export class CustomerService {

    sdkDb: any;
    customersRef: string = '/customers/';

    customer: Customer;
    customers: FirebaseListObservable<Customer[]>;

    constructor(
        private db: AngularFireDatabase,
        private authService: AuthenticationService,
        @Inject(FirebaseRef) fb
    ) {

        this.sdkDb = fb.database().ref();
    }

    getCustomers(): Observable<Customer[]> {

        return this.db.list(this.customersRef, {
            query: {
                orderByChild: 'organisation'
            }
        })
            .map(Customer.fromJsonList)

    }

    getCustomer(customerIndex: string) {

        this.db.object('/customers/' + customerIndex)
            .subscribe(customer => {
                this.customer = customer;
            });
        return this.customer;
    }

    addCustomer(customer: any) {

        const newCustomer = Object.assign({}, customer);

        const newCustomerKey = this.sdkDb.child(this.customersRef).push().key;

        this.customer = newCustomerKey;

        let dataToSave = {};

        dataToSave[this.customersRef + newCustomerKey] = newCustomer;

        return this.firebaseUpdate(dataToSave);

    }

    updateCustomer(customerIndex: string, customer: Customer): Observable<any> {

        const customertoSave = Object.assign({}, customer);

        let dataToSave = {};
        dataToSave[this.customersRef + customerIndex] = customertoSave;

        return this.firebaseUpdate(dataToSave);

    }

    deleteCustomer(customerIndex: string) {
        this.db.object(this.customersRef + customerIndex).remove();
    }

    firebaseUpdate(dataToSave) {
        const subject = new Subject();

        this.sdkDb.update(dataToSave)
            .then(
            val => {
                subject.next(val);
                subject.complete();

            },
            err => {
                subject.error(err);
                subject.complete();
            }
            );

        return subject.asObservable();
    }

}

认证服务

import { Injectable, Inject } from "@angular/core";
import { Observable, Subject, BehaviorSubject } from 'rxjs/Rx';
import { FirebaseAuth, FirebaseAuthState, FirebaseRef, AngularFireDatabase } from 'angularfire2/index';

import { User, UserProfile } from "./user-model";
import { AuthInfo } from './auth-info';

import { Router } from "@angular/router";

import { Customer } from '../customer/customer-model';
import { CustomerService } from '../customer/customer.service';

declare var firebase: any;

@Injectable()
export class AuthenticationService {
  user: User;

  sdkDb: any;
  customer: any;
  usersRef: string = '/users/';
  customersRef: string = '/customers/';
  static UNKNOWN_USER = new AuthInfo(null);
  authInfo$: BehaviorSubject<AuthInfo> = new BehaviorSubject<AuthInfo>(AuthenticationService.UNKNOWN_USER);

  constructor(private auth: FirebaseAuth,
    private db: AngularFireDatabase,
    private customerService: CustomerService,
    @Inject(FirebaseRef) fb,
    private router: Router) {
    this.sdkDb = fb.database().ref();
  }

  getCurrentUserId() {

    firebase.auth().onAuthStateChanged(function (user) {
      if (user) {
        this._userId = firebase.database().ref() + (firebase.auth().currentUser.uid);
        return this._userid;
      }
    });
  }

  signUpUser(user: User) {
    this.user = user;
    return this.fromFirebaseAuthPromise(this.auth.createUser(user)
      .then(user => {
        this.addNewCustomer(this.user.organisation);
        this.addNewUserProfile(user.uid, this.customer);
      }));
  }

  addNewCustomer(organisation: string) {
    this.customer = new Object({
      organisation: ''
      // overview: '',
      // imagePath: '',
    });
    this.customer.organisation = organisation;

    return this.customerService.addCustomer(this.customer);

  }

  addNewUserProfile(userId: string, organisation: string) {

    const newUserProfile = new UserProfile();
    newUserProfile.userId = userId;
    newUserProfile.organisation = this.user.organisation;

    const newUserProfileKey = this.sdkDb.child(this.usersRef).push().key;

    let dataToSave = {};

    dataToSave[this.usersRef + newUserProfileKey] = newUserProfile;

    this.firebaseUpdate(dataToSave);

  }

  signinUser(email, password): Observable<FirebaseAuthState> {
    return this.fromFirebaseAuthPromise(this.auth.login({ email, password }));
  }

  fromFirebaseAuthPromise(promise): Observable<any> {
    const subject = new Subject<any>();

    promise
      .then(res => {
        const authInfo = new AuthInfo(this.auth.getAuth().uid);
        this.authInfo$.next(authInfo);
        subject.next(res);
        subject.complete();
      },
      err => {
        this.authInfo$.error(err);
        subject.error(err);
        subject.complete();
      });

    return subject.asObservable();
  }

  logout() {
    firebase.auth().signOut();
    this.router.navigate(['/home']);
  }

  private postSignIn(): void {
    this.router.navigate(['/customer/list']);
  }

  firebaseUpdate(dataToSave) {
    const subject = new Subject();

    this.sdkDb.update(dataToSave)
      .then(
      val => {
        subject.next(val);
        subject.complete();

      },
      err => {
        subject.error(err);
        subject.complete();
      }
      );

    return subject.asObservable();
  }
}

应用程序模块

import { NgModule } from '@angular/core';
import { HttpModule, JsonpModule } from '@angular/http';
import { BrowserModule } from '@angular/platform-browser';
import { ReactiveFormsModule } from '@angular/forms';

import * as firebase from 'firebase';
import { AngularFireModule, AngularFire } from 'angularfire2';
import { firebaseConfig, authConfig } from '../environments/firebase.config';

import 'rxjs/add/operator/do';

import { MaterialModule } from '@angular/material';

import { AppComponent } from './app.component';

import { AppRoutingModule, routingComponents } from './app.routing';

import { AuthenticationModule } from "./authentication/authentication.module";
import { SharedModule } from "./shared/shared.module";
import { DashboardModule } from "./dashboard/dashboard.module";
import { CustomerModule } from "./customer/customer.module";
import { UserModule } from "./user/user.module";

import { AuthenticationService } from "./authentication/authentication.service";
import { AuthenticationGuard } from "./authentication/authentication.guard";
import { CustomerService } from "./customer/customer.service";
import { UserService } from "./user/user.service";
import { PagingService } from "./shared/paging/paging.service";
import { SearchService } from "./shared/search/search.service";

@NgModule({
  declarations: [
    AppComponent,
    routingComponents
  ],
  imports: [
    BrowserModule,
    ReactiveFormsModule,
    HttpModule,
    JsonpModule,
    AngularFireModule.initializeApp(firebaseConfig, authConfig),
    MaterialModule.forRoot(),
    AppRoutingModule,
    AuthenticationModule,
    SharedModule,
    DashboardModule,
    CustomerModule,
    UserModule
  ],
  providers: [
    AngularFire,
    AuthenticationService,
    AuthenticationGuard,
    CustomerService,
    UserService,
    PagingService,
    SearchService],
  bootstrap: [AppComponent]
})
export class AppModule { }

Answer 1

尝试在您的CustomerService构造函数中添加@inject(ForwordRef(()=>AuthenticationService))private AuthService:AuthenticationService。

记住从`@angull/core'导入forwardRef。