Item scope in TypeScript(JavaScript)

Question

I want to use sqlite database in ionic2.

I could connect to the database and retrieved items data successfully in the following code. But I could have not push into this.items array.

Error says:

undefined is not an object(evaluating 'this.items')

Does anyone know what the problem is? I guess it's variable scope but I'm not sure.

import {Page, Platform} from 'ionic-angular';
declare var sqlitePlugin:any;
declare var plugins:any;

@Page({
  templateUrl: 'build/pages/getting-started/getting-started.html'
})
export class GettingStartedPage {
  items: Array<{title: string}>;
  constructor(platform: Platform) {
    platform.ready().then(()=>{
      this.getData();
    });
  }

  getData(){
    sqlitePlugin.openDatabase({name: 'encrypted.db', key: 'Password', location: 'default'}, function(db) {
      db.transaction(function(tx) {
          var query: string = "SELECT * FROM items";
          this.items = []; <-- error happens at this row.
          tx.executeSql(query, [], function(tx, resultSet) {
            //alert("name: " + resultSet.rows.item(0).name);
            this.items.push({
              title: resultSet.rows.item(0).name
            });            
          }, function(error) {
            alert('SELECT error: ' + error.message);
            console.log('SELECT error: ' + error.message);
          });
        }, function(error) {
          alert('transaction error: ' + error.message);
          console.log('transaction error: ' + error.message);
        }, function() {
          console.log('transaction ok');
        });
      }, function(error){
        alert('error' + error.message);
    });
  }  
}

Günter Zöchbauer · Accepted Answer · 2016-05-06 07:37:32Z

Use () => instead of function ()

With arrow functions this keeps pointing to the class instead the current function.

import {Page, Platform} from 'ionic-angular';
declare var sqlitePlugin:any;
declare var plugins:any;

@Page({
  templateUrl: 'build/pages/getting-started/getting-started.html'
})
export class GettingStartedPage {
  items: Array<{title: string}>;
  constructor(platform: Platform) {
    platform.ready().then(()=>{
      this.getData();
    });
  }

  getData(){
    sqlitePlugin.openDatabase({name: 'encrypted.db', key: 'Password', location: 'default'}, (db) => {
      db.transaction((tx) => {
          var query: string = "SELECT * FROM items";
          this.items = []; <-- error happens at this row.
          tx.executeSql(query, [], (tx, resultSet) => {
            //alert("name: " + resultSet.rows.item(0).name);
            this.items.push({
              title: resultSet.rows.item(0).name
            });            
          }, (error) => {
            alert('SELECT error: ' + error.message);
            console.log('SELECT error: ' + error.message);
          });
        }, (error) => {
          alert('transaction error: ' + error.message);
          console.log('transaction error: ' + error.message);
        }, () => {
          console.log('transaction ok');
        });
      }, (error) =>{
        alert('error' + error.message);
    });
  }  
}

Collectives™ on Stack Overflow

Item scope in TypeScript(JavaScript)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related