Declaring one variable and use this common variable in all pages

Ionic Framework ionic-v3
3

@willb is right, in ionic 2 all components have isolated scope, in order to have available a variable you need to create a service to be able to comunicate data between components.

But, and this is a big one, if you just make a service and inject it where you need you will not have a global service, you will get multiple instances of the same service, in order to make it a global one that passes state between components, you have to declare it as a singleton provider in your @app component like this:

import {App, IonicApp, Platform} from 'ionic/ionic';

import {Config} from './services/config'
import {DB} from './services/db'
import {MasterService} from './services/master-service'

@App({

  templateUrl: 'app/app.html',
  providers: [Config, DB, MasterService]
})

If you need to have a database variable to be able to make a query, you should make a database service, mine is DB, then you can attach some common behavior to make querys, like transactions…

Here’s an example in one of my old posts: Ionic 2 SqlStorage transactions, how to use?

2 Likes