Call Functions of a class from a different class?

Question

Call Functions of a class from a different class?

Navigation

#1 by (2 votes)

2

I recently implemented a javascript Liberia to my ionic project (winwheel.js)

I have the following function on my Home.ts

Exactly in this line of code 'callbackFinished' : this.alertPrize I call the function alertPrize()

Edited to show all the code

import { Component, ViewChild } from '@angular/core';
import { NavController } from 'ionic-angular';
//librerias
import { Storage } from '@ionic/storage';
import { ModalController } from 'ionic-angular';


//providers
import { PrimeraAperturaProvider } from '../../providers/primera-apertura/primera-apertura';

//pagnias
import { RuletaPage } from '../ruleta/ruleta';
import { GanadorPage } from '../ganador/ganador';


@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {

  public theWheel ;
  public DietaSeleccionada:any;
  public ListaComidas:any;
  public Imagen:any;
  public keys:any;


  constructor(public navCtrl: NavController,private storage: Storage,public _primera : PrimeraAperturaProvider,public modalCtrl: ModalController) {

  }

  ionViewDidLoad(){
    this.checkdata()
  }


  CrearRuleta(lista){
     let arr =[];
     arr = lista;
     let cantidad = arr.length
     
    
      this.theWheel = new Winwheel  
        ({
          'numSegments'  : cantidad,         // Cantidad de segmentos
          'outerRadius'  : 130,       // Tamaño de la ruleta
          'innerRadius'     : 10,             // Circulo del centro
          'textFontSize' : 14,        // Tamaño de la letra
          'segments'     : lista,      
          'animation' :               // Animacion
          {
              'type'     : 'spinToStop',
              'duration' : 5,
              'spins'    : 8,
              'callbackFinished' : this.alertPrize
          },
          'pins' :    // Specify pin parameters.
          {
              'number'      : 18,
              'outerRadius' : 5,
              'margin'      : 10,
              'fillStyle'   : '#FFF',
              'strokeStyle' : '#bfa100'
          }

      });
  }



   alertPrize(indicatedSegment) 
  {
    this.MostrarGanador(indicatedSegment)
 
  }

  MostrarGanador(dato){
    let modal = this.modalCtrl.create(GanadorPage)
    modal.onDidDismiss(data => { 

      console.log(dato)

    });
    modal.present();
  }


 

}

core.js: 1449 ERROR TypeError: Can not read property 'ShowGanador' of undefined at webpackJsonp.292.HomePage.alertPrize (home.ts: 74) at f.winwheelStopAnimation (winwheel.min.js: 53) at f.i._callback (TweenMax.min.js: 16) at f.k.render (TweenMax.min.js: 14) at Object.i.render (TweenMax.min.js: 17) at Object.E._updateRoot.H.render (TweenMax.min.js: 17) at Object.i.dispatchEvent (TweenMax.min.js: 16) at s (TweenMax.min.js: 16) at t.invokeTask (polyfills.js: 3) at Object.onInvokeTask (core.js: 4751)

I think the function MostrarGanador() takes it as if it were from another class I'm not confused on this topic

javascript typescript ionic

asked by Wilfredo Aleman 11.06.2018 в 14:28

source

1 answer

Because div occupies the height: 100% without indicating it Search for a word within the Java Files variable

score 2 · Accepted Answer

The problem is the classic loss of Javascript context:

class Ejemplo {

  constructor() {
    this.dato = 'Un dato';
  }
  
  escribeDato() {
    console.log(this.dato);
  }
}


let ej = new Ejemplo();
ej.escribeDato(); //funciona porque this es ej

function callback(func) {
  func();
}

callback(ej.escribeDato); //this es undefined

The solution is simple: the line of code

'callbackFinished' : this.alertPrize

should be modified to

'callbackFinished' : this.alertPrize.bind(this);

where the method bind of the class Function fix the context ( this ) to the parameter you pass.