Phaser and ionic button

Ionic Framework
1

I have a phaser application set up but now I want to start using ionic controls to control whats happening in phaser. On my home.page.ts I have extended Phaser.scene but when I try to access any object that I defined in the class I get an error. Here is the whole home.page.ts code:

import { Component, OnInit } from ‘@angular/core’;
import Phaser from ‘phaser’;
import {Square} from ‘…/classes/square’;
import {HandTable} from ‘…/classes/handTable’;
import {Platform} from ‘@ionic/angular’;

export class GameScene extends Phaser.Scene {
handTable: HandTable;
constructor(config) {
super(config);
}

preload() {
}

create() {
  
  //Phaser.Device.FullScreen.request()
  //platform = new Platform(null, new Zone({}));
  //game.scale.scaleMode = Phaser.Scale.SHOW_ALL;
  let width= this.sys.game.canvas.width;
  let height= this.sys.game.canvas.height;
  
  /*var viewport = this.scale.getViewPort();
  let width=  viewport.width;
  let height = viewport.height;*/

  let squaresize= width/13;
  this.handTable = new HandTable(this,0,0,squaresize);
  this.add.text(0, height-30 , 'this.sys.game.canvas.height:'+height, { color: '#ffffff', align: 'left' });
  this.add.text(0, height-50 , 'this.sys.game.canvas.width:'+width, { color: '#ffffff', align: 'left' });
  
  this.add.text(width-10,height-100,'X',{color:'#ffff00',align:'left'});
  //this.add.text(0,height-70,'Platform:'+this.platform.platforms()[2]);
}

override update() {
}

}

@Component({
selector: ‘app-home’,
templateUrl: ‘home.page.html’,
styleUrls: [‘home.page.scss’],
})
export class HomePage implements OnInit {
phaserGame: Phaser.Game;
config: Phaser.Types.Core.GameConfig;

constructor(public platform: Platform) {

console.log (platform.platforms()[0]);
this.config = {
type: Phaser.AUTO,
scale: {
mode: Phaser.Scale.FIT,
autoCenter: Phaser.Scale.CENTER_BOTH,
width:800,
height:800
},

        backgroundColor: "0xcccccc",
  	physics: {
            default: 'arcade'
        },
        parent: 'ranger',
        scene: GameScene
    };

}
ngOnInit(): void {
this.phaserGame = new Phaser.Game(this.config);
}
test (){
this.phaserGame.scene.getScene(“GameScene”).handTable.squares[0][0].hand.set_handstr (“XX”);
}
}

The problem is in the test function. Thank you for your answers!

2

So the test function will work when I use getScenes + typecast the scene. The correct test function:

test (){
(this.phaserGame.scene.getScenes()[0] as GameScene).handTable.squares[0][0].hand.set_handStr (“XX”);
}