ionic 3 - undefined variable in Ionic3 page

Question

I have 2 questions regarding ionic 3.

1. In my ionic3 page I declare a variable called 'test' whict cannot be access in actionOnClick function . Does anyone know way? What should I do so that 'test' in accessible anywere in FUNCTION_TEST function?

2. Is there a way to make possible the variables exchange between HomePage and FUNCTION_TEST?

Bellow is my ionic3 code.

import { Component,ViewChild } from '@angular/core';
import { NavController } from 'ionic-angular';
import {Content} from 'ionic-angular';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
  @ViewChild(Content) content:Content;
  test:string="text 1";

  constructor(public navCtrl: NavController) {

  }

  ionViewDidEnter(){
     this.FUNCTION_TEST();
  }

  FUNCTION_TEST(){
     var x=1;

     function actionOnClick(){
         alert("text="+this.test);  
     }

  }
}

Is it possible that my problem have to do with javascript and not with ionic?

Thanks a lot for your help!

Answer 1

Regarding your first question, you are trying to access a global variable inside a local enviroment (actionOnClick). To resolve this you should make your function like this, but take in mind it will not be accesible from outside (HTML page for example):

FUNCTION_TEST(){
     var x=1;

     let actionOnClick = () => {
         alert("text="+this.test);  
     }

  }

This will let you acces this.test from there.

---

Regarding your second question, I don't understand it, if you want to access actionOnClick() from your HomePage you will need to declare it as another function of the class like this:

FUNCTION_TEST(){
     var x=1;

  }

actionOnClick(){
         alert("text="+this.test);  
     }

And then call it like this for example:

<button ion-button block (click)="actionOnClick()">Click Me</button>

Hope this helps you.