How to share a WebAudio's AudioContext to all pages in Ionic2

Ionic Framework ionic-v3
1

I want need to use Web Audio API in an app and I can not find the way to share a reusable AudioContext between all my Pages.

I searched about how to share data between pages and I found this link, it works for share data but when I put it an new AudioContext() I am just able to play a sound the first time I go into a Page and create a OscillatorNode, after that It does not show an error but just do not sound does not matter how many OscillatorNodes are there, the only way is to create a new AudioContext() what is really a bad idea.

I am sure I am doing something completely wrong because I also can not see the audio nodes in Firefox Audio Web debugger.

I have created my provider

export class WebAudioApiService {

 private _AudioContext: AudioContext;
 private _MainGainNode: GainNode;

constructor() {
    this._AudioContext = new AudioContext();
    this._MainGainNode = this._AudioContext.createGain();
    this._MainGainNode.connect(this._AudioContext.destination);
    this._MainGainNode.gain.value = 0.5;
    console.log("WebAudioApiService Constructor Done");

    // this does sound:
    var osct = this._AudioContext.createOscillator();
    osctemp.frequency.value = 500;
    osctemp.connect(this._MainGainNode);
    osctemp.start();
    osctemp.stop(2);
}



PlayOscillator(hz: number){

//This does not sound
    var osct = this._AudioContext.createOscillator();
    osct.frequency.value = hz;
    osct.connect(this._MainGainNode);
    osct.start();
    osct.stop(2);
    console.log("playing: "+hz);
}

}

I import it in app.component.ts

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar, Splashscreen } from 'ionic-native';

import { TabsPage } from '../pages/tabs/tabs';

import {WebAudioApiService} from './services/WebAudioApiService';


@Component({
  templateUrl: 'app.html',
  providers: [WebAudioApiService]
})

export class MyApp {
  rootPage = TabsPage;
  constructor(platform: Platform) {
    platform.ready().then(() => {
      // Okay, so the platform is ready and our plugins are available.
      // Here you can do any higher level native things you might need.
      StatusBar.styleDefault();
      Splashscreen.hide();
    });
  }
}

and I call it from my Page Class

import { Component, Injectable, Inject } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';

import {WebAudioApiService} from '../../app/services/WebAudioApiService'
/*
Generated class for the oscillator page.

See http://ionicframework.com/docs/v2/components/#navigation for more info on
Ionic pages and navigation.
*/
@Component({
    selector: 'page-oscillator',
    templateUrl: 'oscillator.html'
})

@Injectable()
export class oscillatorPage {
    WebAudioApiService;
    constructor(public navCtrl: NavController,
                public navParams: NavParams,
                public webAudioApiService: WebAudioApiService,
                ) {
        this.AppConfig = config;
        this.WebAudioApiService = webAudioApiService;
    }

    playSine(hz:number){
        console.log(hz);
        this.WebAudioApiService.PlayOscillator(hz);

    }
    ionViewDidLoad() {
        console.log('ionViewDidLoad oscillatorPage');
    }


}

The first time I go into my Page, WebAudioApiService run his constructor and it sounds, later when I call playSine() -> this.WebAudioApiService.PlayOscillator(hz) I do not get any error but also I do not get any sound.

I have banged my head for the last three days and I can not find the reason. Does anyone knows what I have to do?

Thanks