Question

启动应用程序时发生此错误。终端在浏览器控制台中未显示任何错误。最后一个动作是我从'@ auth0 / angular-jwt'导入JwtHelperService

项目在Nodejs中，表示4.16.4和angular 7.2.0 我已经包含一些代码请帮助我找到错误预先谢谢你

auth.service.ts

import { Injectable } from "@angular/core";
import { Observable } from "rxjs";
import "rxjs/Rx";
import { JwtHelperService } from "@auth0/angular-jwt";
import { map } from "rxjs/operators";
import "core-js/es7/reflect";

import { HttpClient } from "@angular/common/http";

const jwt = new JwtHelperService();
export class AuthService {
  @Injectable()
  private decodedToken;
  constructor(private http: HttpClient) {}
  public register(userData: any): Observable<any> {
    return this.http.post("/api/v1/users/register", userData);
  }
  public login(userData: any): Observable<any> {
    return this.http.post("/api/v1/users/auth", userData).map(token => {
      //debugger;
      return this.saveToken(token);
    });
  }

  private saveToken(token): string {
    //debugger;
    this.decodedToken = jwt.decodeToken(token);
    localStorage.setItem("bwm_auth", token.token);
    localStorage.setItem("bwm_meta", JSON.stringify(this.decodedToken));
    return token;
  }
}

app.module.ts

import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { FormsModule, ReactiveFormsModule } from "@angular/forms";
import { Routes, RouterModule } from "@angular/router";

import { LoginComponent } from "./login/login.component";
import { RegisterComponent } from "./register/register.component";

import { AuthService } from "./shared/auth.service";

const routes: Routes = [
  { path: "login", component: LoginComponent },
  { path: "register", component: RegisterComponent }
];

@NgModule({
  declarations: [LoginComponent, RegisterComponent],
  imports: [
    RouterModule.forChild(routes),
    FormsModule,
    CommonModule,
    ReactiveFormsModule
  ],
  exports: [],
  providers: [AuthService]
})
export class AuthModule {}

浏览器错误

compiler.js:2430 Uncaught Error: Can't resolve all parameters for AuthService: (?).
    at syntaxError (compiler.js:2430)
    at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getDependenciesMetadata (compiler.js:18984)
    at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getTypeMetadata (compiler.js:18877)
    at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getInjectableTypeMetadata (compiler.js:19099)
    at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver.getProviderMetadata (compiler.js:19108)
    at compiler.js:19046
    at Array.forEach (<anonymous>)
    at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver._getProvidersMetadata (compiler.js:19006)
    at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver.getNgModuleMetadata (compiler.js:18725)
    at CompileMetadataResolver.push../node_modules/@angular/compiler/fesm5/compiler.js.CompileMetadataResolver.getNgModuleSummary (compiler.js:18555)

image of error in browser

Answer 1

@Injectable() 应该放在类定义之前

 @Injectable()
 export class AuthService {

 }

Answer 2

您应该首先将 @Injectable 添加到您的 AuthService

但是此错误表明DI无法解析AuthService（HttpClient）请求的请求参数。

要解决此问题，您需要在AppModule中包含HttpClient模块，如以下代码片段所示

import { NgModule }         from '@angular/core';
import { BrowserModule }    from '@angular/platform-browser';
import { HttpClientModule } from '@angular/common/http';
@NgModule({
  imports: [
    BrowserModule,
    // import HttpClientModule after BrowserModule.
    HttpClientModule,
  ],
  declarations: [
     AppComponent,
  ],
  bootstrap: [ AppComponent ]
})
export class AppModule {}

您可以在这里HttpModule

查看其完整文档。

如何解决“未捕获的错误：无法解析AuthService的所有参数：（？）。”

2 个答案: