Storage injection problems in ionic

Question

I am getting error when I am injection Storage service in my User service. I took a project template and I cannot see the error myself.

File: app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platfoenter code hererm-browser';
import { IonicStorageModule, Storage } from '@ionic/storage';
import { IonicApp, IonicModule } from 'ionic-angular';
import { HTTP } from '@ionic-native/http';
import { Settings } from '../providers/providers';
import { User } from '../providers/providers';
import { Api } from '../providers/providers';
import { MyApp } from './app.component';

export function provideSettings(storage: Storage) {
  return new Settings(storage, {
    option1: true,
    option2: 'Ionitron J. Framework',
    option3: '3',
    option4: 'Hello'
  });
}

@NgModule({
  declarations: [
    MyApp
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot()
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp
  ],
  providers: [
    Api,
    HTTP,
    User,
    { provide: Settings, useFactory: provideSettings, deps: [Storage]}
})
export class AppModule { }

File: user.ts

import { Injectable } from '@angular/core';
import { Api } from '../api/api';
import { Storage } from '@ionic/storage';
import { HTTP } from '@ionic-native/http';
import { Observable } from 'rxjs/Observable';

@Injectable()
export class User {
  username: string;
  customerId: string;

  constructor(public api: Api, public http: HTTP, private storage: Storage) { }

  /**
   * Use Basic authentication and send a request to our endpoint to get an id
   */
  login(username: string, password: string){
    return new Observable<void>(observer => {
      this.api.me().then(
      (data) => {
        this.storage.set('CustomerId', data['customerId']);
        observer.next();
      },
      error => {
        console.error('ERROR', error);
        observer.error(error);
      });

    });

  }

The error that I am gettings is:

Error: Uncaught (in promise): Error: StaticInjectorError[Storage]: StaticInjectorError[Storage]: NullInjectorError: No provider for Storage! Error: StaticInjectorError[Storage]: StaticInjectorError[Storage]: NullInjectorError: No provider for Storage! at _NullInjector.get (http://localhost:8100/build/vendor.js:1276:19) at resolveToken (http://localhost:8100/build/vendor.js:1564:24)

Answer 1

You need to provide Storage in your @NgModule

import { Storage } from '@ionic/storage';


@NgModule({
  ...
  providers: [
   ...
    Storage,
    ...
})