Question

我有一个问题，到目前为止我找不到一个anwser。

所以我有3页的离子项目和api连接的提供者。

Scanner.ts：

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import { QRScanner, QRScannerStatus } from '@ionic-native/qr-scanner';
import { AlertController } from 'ionic-angular';
import {StorageProvider} from "../../providers/storage/storage";
import {ApiProvider} from "../../providers/api/api";
import {DocsPage} from "../docs/docs";
import {GlobalvarProvider} from "../../providers/globalvar/globalvar";

//https://ionicframework.com/docs/native/native-storage/
@Component({
  selector: 'page-scanner',
  templateUrl: 'scanner.html'
})
export class ScannerPage {

  key : string;

  GlobalvarProvider : any = GlobalvarProvider;

  constructor(public navCtrl: NavController,
              private qrScanner: QRScanner,
              private alertCtrl: AlertController,
              private storage: StorageProvider,
              private api: ApiProvider) {}

  public changeToHomePage(){
    this.navCtrl.setRoot(DocsPage);
    GlobalvarProvider.setPagesConnected();
  }

  textInput(){
    this.api.connectToAPI(this.key);
  }

  scanner(){
    //Testcode: https://ionicframework.com/docs/native/qr-scanner/
    this.qrScanner.prepare()
      .then((status: QRScannerStatus) => {
        if (status.authorized) {
          // camera permission was granted
          // start scanning
          let scanSub = this.qrScanner.scan().subscribe((text: string) => {
            //Mit API verbinden
            this.api.connectToAPI(text);

            this.qrScanner.hide(); // hide camera preview
            scanSub.unsubscribe(); // stop scanning
          });
          // show camera preview
          this.qrScanner.show();
          // wait for user to scan something, then the observable callback will be called
        } else if (status.denied) {
          // camera permission was permanently denied
          // you must use QRScanner.openSettings() method to guide the user to the settings page
          // then they can grant the permission from there
        } else {
          // permission was denied, but not permanently. You can ask for permission again at a later time.
        }
      })
      .catch((e: any) => console.log('Error is', e));
  }
}

如果我在ScannerPage上使用Api Provider，则不会发生错误，我可以使用Api。

虽然在DocsPage上使用APi Provider会出现错误。

Docs.ts

import { Component } from '@angular/core';
import {NavController, NavParams} from 'ionic-angular';
import { ApiProvider } from "../../providers/api/api";
import {StorageProvider} from "../../providers/storage/storage";

@Component({
  selector: 'page-docs',
  templateUrl: 'docs.html',
})
export class DocsPage {

  items: Array<{title: string}>;

  constructor(public navCtrl: NavController,
              public navParams: NavParams,
              private storage: StorageProvider,
              private api : ApiProvider) {
   // this.api.updateResources();
    this.items =[];
  }

  doRefresh(refresher) {
    refresher.complete();
  }

  /*itemTapped(event, item) {
    // That's right, we're pushing to ourselves!
    this.navCtrl.push(HomePage, {
      item: item
    });
  }*/

}

错误：

Uncaught Error: Can't resolve all parameters for SettingsPage: ([object Object], [object Object], [object Object], ?).
    at syntaxError (compiler.js:466)
    at CompileMetadataResolver._getDependenciesMetadata (compiler.js:15547)
    at CompileMetadataResolver._getTypeMetadata (compiler.js:15382)
    at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:14890)
    at CompileMetadataResolver._getEntryComponentMetadata (compiler.js:15695)
    at compiler.js:15165
    at Array.map (<anonymous>)
    at CompileMetadataResolver.getNgModuleMetadata (compiler.js:15165)
    at JitCompiler._loadModules (compiler.js:33542)
    at JitCompiler._compileModuleAndComponents (compiler.js:33503).

从DocsPage中删除ApiProvider引用可以解决错误，但为什么我可以在scanner页面上没有错误地使用提供程序？

两个页面都使用相同的模块文件 app.moduls.ts

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';

import { MyApp } from './app.component';
import { ScannerPage } from '../pages/scanner/scanner';
import { DocsPage } from "../pages/docs/docs";
import { SettingsPage} from "../pages/settings/settings";

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { QRScanner} from "@ionic-native/qr-scanner";
import { IonicStorageModule } from '@ionic/storage';
import { StorageProvider } from '../providers/storage/storage';
import { NativeStorage } from "@ionic-native/native-storage";
import { ApiProvider } from '../providers/api/api';
import { HttpClient, HttpClientModule} from "@angular/common/http";
import { GlobalvarProvider } from '../providers/globalvar/globalvar';

@NgModule({
  declarations: [
    MyApp,
    ScannerPage,
    DocsPage,
    SettingsPage
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    IonicStorageModule.forRoot(),
    IonicModule.forRoot(MyApp),
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    ScannerPage,
    DocsPage,
    SettingsPage,
  ],
  providers: [
    StatusBar,
    SplashScreen,
    QRScanner,
    NativeStorage,
    HttpClient,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    StorageProvider,
    ApiProvider,
    GlobalvarProvider
  ]
})
export class AppModule {}

Answer 1

所以我得到了它的工作，感谢您的评论。问题是，在ApiProvider中我引用了一个导入DocsPage.ts的GlobalvarProvider，以便能够将它添加到菜单列表中。 Removing this reference got rid of this error

离子：提供者无法解析

1 个答案: