Error: Can't resolve all parameters for Storage: (?, ?). ionic

Error: Can't resolve all parameters for Storage: (?, ?). ionic

我遇到了这个错误“NullInjectorError:没有存储提供者!”然后我在 app.module.ts

中添加存储

然后我遇到了另一个错误:错误:无法解析存储的所有参数:(?, ?)

有时我遇到了这个错误:

Uncaught TypeError: Cannot read property 'id' of undefined
core.js:24134 Uncaught TypeError: Cannot read property 'id' of undefined
    at registerNgModuleType (core.js:24134)
    at core.js:24145
    at Array.forEach (<anonymous>)
    at registerNgModuleType (core.js:24145)
    at new NgModuleFactory (core.js:24242)
    at compileNgModuleFactory__POST_R3__ (core.js:27786)
    at PlatformRef.bootstrapModule (core.js:28024)
    at Module../src/main.ts (main.ts:11)
    at __webpack_require__ (bootstrap:84)
    at Object.0 (main.ts:12

我尝试导入 IonicStorageModule,结果是一样的

app.moudle.page.ts 文件:

import { Component, OnInit } from '@angular/core';
import { NavController, NavParams, LoadingController, AlertController, ModalController  } from '@ionic/angular';
import { PersonalinfoService } from 'src/app/services/personalinfo.service';
import { AlertService } from 'src/app/services/alert.service';
import { Saudi } from '../../../app/models/saudi';
import { ErrorsService } from '../../../app/services/errors.service';


@Component({
  selector: 'app-personalinfo',
  templateUrl: './personalinfo.page.html',
  styleUrls: ['./personalinfo.page.scss'],
})
export class PersonalinfoPage{
  public personal_info : any;
  private loading : any;
 
  constructor(public navCtrl: NavController,
    public navParams: NavParams,
    private personalinfoService : PersonalinfoService,
    private errorsService : ErrorsService,
    public modalCtrl: ModalController,
    private loadingCtrl : LoadingController,
    private alertCtrl : AlertController,
    public storage: Storage,
   

    ) {

      this.personal_info = this.navParams.get('personal_info') || new Saudi();

      // هذذا حلو بس ماضبط

      // this.loading = this.loadingCtrl.create({
      //   content: 'Please wait...',
      //   spinner: 'bubbles'
      // });

    }
    
    ionViewDidLoad() {
      console.log('ionViewDidLoad addInfoPage');
    }
    
   
    addInfo() {
      
          let data = {
            personal_info: this.personal_info
          }
          this.personalinfoService.store( JSON.stringify( data ) ).subscribe(
            personal_info => {
              this.personal_info = personal_info;
              this.loading.dismiss();
              this.dismiss( true );
            },
          );
    }

  closeModal(){
    this.dismiss(false);
  }

  dismiss( returnParam : boolean ) {
    let data = { 'personal_info': this.personal_info, 'returnParam': returnParam };
    this.modalCtrl.dismiss( data );
  }

}

Register.page.ts 文件

import { Component, OnInit } from '@angular/core';
import { ModalController, NavController } from '@ionic/angular';
import { LoginPage } from '../login/login.page';
import { AuthService } from 'src/app/services/auth.service';
import { NgForm } from '@angular/forms';
import { AlertService } from 'src/app/services/alert.service';

@Component({
  selector: 'app-register',
  templateUrl: './register.page.html',
  styleUrls: ['./register.page.scss'],
})
export class RegisterPage implements OnInit {

  constructor(private modalController: ModalController,
    private authService: AuthService,
    private navCtrl: NavController,
    private alertService: AlertService
  ) { }

  ngOnInit() {
  }
  dismissRegister() {
    this.modalController.dismiss();
  }
  async loginModal() {
    this.dismissRegister();
    const loginModal = await this.modalController.create({
      component: LoginPage,
    });
    return await loginModal.present();
  }
  register(form: NgForm) {
    this.authService.register(form.value.name, form.value.email, form.value.password).subscribe(
      data => {
        this.authService.login(form.value.email, form.value.password).subscribe(
          data => {
          },
          error => {
            console.log(error);
          },
          () => {
            this.dismissRegister();
            this.navCtrl.navigateRoot('/personalinfo');
          }
        );
        this.alertService.presentToast(data['message']);
      },
      error => {
        console.log(error);
      },
      () => {
      }
    );
  }
}

在我添加个人页面之前一切正常。 我没有别的,但模型中添加了一个id

更新:

当它正常工作并重新开始时,我会后退一步

事情又来了

我有一个名为主页、个人信息的页面 登录成功后调用home,在首页调用personalinfo页面 我是这样导入的:因为我遇到了这个错误“没有个人信息服务提供者!” 主页-routing.module.ts

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { HomePage } from './home.page';
import { PersonalinfoPage } from './../personalinfo/personalinfo.page';


const routes: Routes = [
  {
    path: '',
    component: HomePage
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes),
    PersonalinfoPage
  ],
  exports: [RouterModule],
})
export class HomePageRoutingModule {}

我确实错过了

@Injectable({

providedIn: 'root'

})

在所有未命中的服务文件中

谢谢你

正如提到的in the docs,您需要在AppModule:

中导入IonicStorageModule.forRoot()
import { IonicStorageModule } from '@ionic/storage';

@NgModule({
  declarations: [
    // ...
  ],
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot() // <--- here!
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    // ...
  ],
  providers: [
    // ...
  ]
})
export class AppModule {}

除此之外,在您的 personalifo.ts 文件中,您正在注入 Storage 但这实际上不是 Ionic 的存储而是 Web 存储 API – 当鼠标悬停在Storage class:

为了注入正确的依赖项,您需要在文件顶部添加以下导入:import { Storage } from '@ionic/storage'; 以确保您使用的是 Ionic 的存储:

import { Storage } from '@ionic/storage'; // <--- here!
// ...

@Component({
  selector: 'app-personalinfo',
  templateUrl: './personalinfo.page.html',
  styleUrls: ['./personalinfo.page.scss'],
})
export class PersonalinfoPage {
  constructor(
    public storage: Storage,
    // ...
  ) {}
}