Error: This constructor is not compatible with Angular Dependency Injection

Question

我正在我的登录页面中导入一个服务，但是当它给我这个错误时，我的服务文件中有所有装饰器，我的应用程序模块中有所有正确的导入。但我不知道为什么这个错误仍然存在。我一直在以同样的方式导入服务，但我不知道在组件中注入该服务到底需要什么。

Uncaught (in promise): Error: This constructor is not compatible with Angular Dependency Injection because its dependency at index 2 of the parameter list is invalid.
This can happen if the dependency type is a primitive like a string or if an ancestor of this class is missing an Angular decorator.

loginPage.ts

import { UserService } from "src/app/services/user.service";

 constructor(
    public navCtrl: NavController,
    private userService: UserService) { }

async doLogin() {
    let loader = await this.loadingCtrl.create({
      message: "Please wait...",
    });
    loader.present();

    this.userService.login(this.account).subscribe(
      (resp) => {
        loader.dismiss();
        this.navCtrl.navigateRoot("");
        //this.push.init();
      })};

我的userService.ts

import { HttpApiService } from "./httpapi.service";
import { DeviceInfo } from "@capacitor/core";
import { AnalyticsService } from "./analytics.service";

@Injectable({
  providedIn:"root"
})
export class UserService {
  _user: any;

  constructor(
    private api: HttpApiService,
    private al: AnalyticsService,
    private device: DeviceInfo  
  ) {}
// all other methods ....
}

我的 httpApiService

import { Injectable } from "@angular/core";
import { HttpClient } from "@angular/common/http";
import { Observable } from "rxjs";

@Injectable({
  providedIn: "root",
})
export class HttpApiService {
  // LIVE

  constructor(private http: HttpClient) {
    this.url = "my url";
  }

  get(endpoint: string, params?: any, options?): Observable<any> {
    // Support easy query params for GET requests
    if (params) {
      let p = new URLSearchParams();
      for (let k in params) {
        p.set(k, params[k]);
      }
      // Set the search field if we have params and don't already have
      // a search field set in options.
      options.search = (!options.search && p) || options.search;
    }

    return this.http.get(this.url + "/" + endpoint, options);
  }

  post(endpoint: string, body: any, options?): Observable<any> {
    return this.http.post(this.url + "/" + endpoint, body, options);
  }

  put(endpoint: string, body: any, options?): Observable<any> {
    return this.http.put(this.url + "/" + endpoint, body, options);
  }

  delete(endpoint: string, options?): Observable<any> {
    return this.http.delete(this.url + "/" + endpoint, options);
  }

  patch(endpoint: string, body: any, options?): Observable<any> {
    return this.http.put(this.url + "/" + endpoint, body, options);
  }
}

我的离子信息

Ionic:

   Ionic CLI                     : 5.2.7 (C:\Users\Adit\AppData\Roaming\npm\node_modules\ionic)
   Ionic Framework               : @ionic/angular 5.1.1
   @angular-devkit/build-angular : 0.901.7
   @angular-devkit/schematics    : 9.1.6
   @angular/cli                  : 9.1.7
   @ionic/angular-toolkit        : 2.2.0

Capacitor:

   Capacitor CLI   : 2.1.0
   @capacitor/core : 2.1.0

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v10.16.3 (C:\Program Files\nodejs\node.exe)
   npm    : 6.11.3
   OS     : Windows 10

Answer 1

在我的 userService.ts 中，我从构造函数中调用了电容器插件，这是错误的，它造成了模块错误，因为它不能注入到组件中，需要根据文档声明为常量。

我的老userService.ts

import { HttpApiService } from "./httpapi.service";
import { DeviceInfo } from "@capacitor/core";
import { AnalyticsService } from "./analytics.service";

@Injectable({
  providedIn:"root"
})
export class UserService {
  _user: any;

  constructor(
    private api: HttpApiService,
    private al: AnalyticsService,
    private device: DeviceInfo  
  ) {}
// all other methods ....
}

我的新userService.ts

import { HttpApiService } from "./httpapi.service";
import { AnalyticsService } from "./analytics.service";
import { Plugins } from "@capacitor/core";
const { Device } = Plugins;

@Injectable({
  providedIn:"root"
})
export class UserService {
  _user: any;

  constructor(
    private api: HttpApiService,
    private al: AnalyticsService, 
  ) {}

async getInfo(){
const info = await Device.getInfo();
console.log(info);
}
// all other methods ....
}

Error: This constructor is not compatible with Angular Dependency Injection

Error: This constructor is not compatible with Angular Dependency Injection

angular

ionic-framework

angular9

ionic5