Device.ready in Component and Service in RC5


#1

After updating to RC.2.0.5 from Beta.11, I have to use platform.ready() inside of my component that uses a service that uses platform.ready(). I have the following implementation:

import { Component, Injectable } from '@angular/core';
import { SQLite } from 'ionic-native';

import { NavController, Platform } from 'ionic-angular';
import { Observable } from 'rxjs/Rx';

@Injectable()
export class PageService {
  db: any;
  createUsageString = 'CREATE TABLE IF NOT EXISTS Usage (id INTEGER PRIMARY KEY AUTOINCREMENT, kWh NUMBER)';

  constructor(private platform: Platform) {
    platform.ready().then(() => {
      console.log('ready');
      console.log(SQLite);
      this.db = new SQLite();
      console.log(this.db);
      this.db.openDatabase({
        name: 'usage.db',
        location: 'default' // the location field is required
      }).then(() => {
        this.db.transaction((tx) => {
          tx.executeSql(this.createUsageString);
        }).then(() => {
          console.log('tables created');
          }).subscribe(data=>{
            console.log('this is the data',data);
          })
        }).catch((err) => {
          console.log('tables already created', err);
        });
      }).catch((err) => {
        console.log('Couldn\'t open database: ', err);
      })
    })
  }

If i use the Service in a page like this:

@Component({
  selector: 'page-page1',
  templateUrl: 'page1.html'
})
export class Page1 {
  constructor(public navCtrl: NavController,private pageService:PageService) {
  }
  ngOnInit(){
    console.log('console from with page component', this.pageService.db);
  }
}

The this.pageService.db returns undefined, but if I wrap it in platform.ready() this.pageService.db is defined. See below:

@Component({
  selector: 'page-page1',
  templateUrl: 'page1.html'
})
export class Page1 {
  constructor(public navCtrl: NavController,private pageService:PageService, private platform: Platform) {
  }
  ngOnInit(){
    this.platform.ready().then(()=>{
    console.log('console from with page component', this.pageService.db);
    })
  }
}

Is this how I’ll have to use services that use native plugins in my components from now on?