Help on Ionic and Ionic native sqlite problem

My Ionic version is 3.7
Install sqlite by running inside app directory: ionic cordova plugin add cordova-sqlite-storage

i started with blank template
ionic start demoapp01 blank
Add a provider
ionic add provider data

My home.html is

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
  <button ion-button full (click)="addItem()">
    insert
  </button>
</ion-content>

my provider data.ts is

import { Injectable } from '@angular/core';
import { Platform } from 'ionic-angular';
import { SQLite, SQLiteObject} from '@ionic-native/sqlite'
/*
  Generated class for the DataProvider provider.

  See https://angular.io/docs/ts/latest/guide/dependency-injection.html
  for more info on providers and Angular DI.
*/
@Injectable()
export class DataProvider {
databaseCreated: Promise<void>;
  constructor(public platform: Platform, public sqlite: SQLite) {
      console.log('datapovider');
      this.databaseCreated = this.create();
  }

  public create(): Promise<void> {
    return this.platform.ready().then(() => {
      this.sqlite.create({
        name: 'teacherApp.db',
        location: 'default'
      })
        .then((db: SQLiteObject) => {
          db.executeSql('create table if not exists lists(id INTEGER PRIMARY KEY AUTOINCREMENT, listname TEXT)', {})
            .then(() => console.log('Created / Opened SQL'))
            .catch(e => console.log(e));

        })
        .catch(e => console.log(e));
    })
  }
  public insertList(listname: string){
    this.databaseCreated.then(() => {
      this.sqlite.create({
        name: 'teacherApp.db',
        location: 'default'
      })
        .then((db: SQLiteObject) => {
          db.executeSql('INSERT INTO lists(listname) VALUES(listname)', {})
            .then(() => console.log('Executed SQL'))
        })
    })
  }
  public getAll() {
    this.databaseCreated.then(() => {
      this.sqlite.create({
        name: 'teacherApp.db',
        location: 'default'
      })
        .then((db: SQLiteObject) => {
          db.executeSql('SELECT * FROM lists', {})
            .then(() => console.log('Executed SQL'))
        })
    })
  }
  
}

My home.ts is

import { Component } from '@angular/core';
import { SQLite, SQLiteObject} from '@ionic-native/sqlite';
import { NavController,Platform } from 'ionic-angular';

import { DataProvider } from '../../providers/data/data';
@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
 
export class HomePage {
  dp : DataProvider;
  constructor(public navCtrl: NavController,platform: Platform) {
      console.log('home constructor');
      
  }
 
  public addItem(){
      this.dp.insertList("daniss");
  }
 
}

WHile running using ionic serve the app home page os diaplyed.
When clcking the button it is giving error

Runtime Error
Cannot read property ‘insertList’ of undefined

Please edit your post, it is not very readable at the moment.
Use the </> button above the input field to format your code, command line output or error message (select the text first, then click the button or wrap it in ``` manually). Check the preview if it looks better. This will make sure your text is readable and if it recognizes the programming language it also automatically adds code syntax highlighting. Thanks.

If you’re only accessing these records by id or “all at once”, you don’t need direct SQLite here. You can use ionic-storage, which will be much easier.

That being said, the proximate cause of your problem is that you don’t bother injecting your DataProvider. Instead of declaring that dp property manually, add it with an access control modifier as a constructor parameter the same way you have navCtrl.

In the document they have suggested to use SQLite .
"When running in a native app context, Storage will prioritize using SQLite, as it’s one of the most stable and widely used file-based databases, and avoids some of the pitfalls of things like localstorage and IndexedDB, such as the OS deciding to clear out such data in low disk-space situations."


Is ionic-storage also know as localstorage.

SQLite is just something like a filesystem thing when used with Ionic Storage. You don’t interact with it directly.

No. If it was, it would not be contrasted with localstorage in the quote you posted.

How can i take backup of Ionic Storage if i cant interact directly.

You probably can - you just shouldn’t. You should interact with Storage and e.g. get all data in their and write it to your backup. This will be a list of JSON objects (or files) and not a sqlite file - because that is what you are saving in Ionic Storage.