Δεν μπορω να καλεσω function μεσα απο αλλη function σε angular6/openlayers5

[slevinkelevra]

Καλησπερα

Angular6/openlayers5 newbie εδω. Εχω φτιαξει μια εφαρμογη σε angular6 και τωρα εχω εισαγει βασικα openlayers5 που φορτωνει καποια geoJSON data, τα περναει ως σημεια στο χαρτη και μπορεις να τα κλικαρεις

Ο κωδικας μου ειναι (τα βασικα, σχετικα με τον χαρτη και τα σημεια)
 

ngOnInit() {
  //ασχετο με openlayers, αλλα δουλευει μεσα στο ngOnInit, ακομα και αν η ιδια η function οριζετε εξω απο αυτο
  this.getCategories();

  //initialize vector layers (openlayers API)
  this.vectorsource = new VectorSource({});
  this.vectorlayer = new VectorLayer({
    source: this.vectorsource
  });

  //δημιουργια ενος click select για τα openlayers (openlayers API)
  var selectClick = new Select({
    condition: click
  });
  //προσθηκη του στον χαρτη (openlayers API)
  this.olmap.addInteraction(selectClick);


//καθε φορα που κλικαρω, παρε τα στοιχεια του σημειου που κλικαρα και καλεσε μια function με αυτα

  selectClick.on(
    'select', function(){
      const values = selectClick.getFeatures().item(0).values_;
      console.log('values -- ', values.name);//δουλευει
      this.getDetails(values.id, values.name);// <--- ERROR
    }
  );

}//ngOnInit

//ορισμος της getDetails εκτος ngOnInit
  getDetails(id, name){
    this.myService.getData(id, name).subscribe((data) =>{
      if(data.success){
        console.log('p o i n t   d e t a i l s   d a t a   > ', data);
      }
    })
  }

 

Και καπου εκει ζει ενα μικρο χαριτωμενο error. Η getDetails μεσα στην selectClick μου δινει 

Αναφορά σε κείμενο

ERROR TypeError: this.getDetails is not a function

Εγω ομως θελω να καλειτε κανονικα, για να παρω αποτελεσματα πισω. Πως μπορω να τη κανω να δουλεψει και τι φταει? Ειναι καποιο θεμα της typescript/angular και του scope μεσα στην selectClick ,που δεν βλεπει την getDetails απ εξω? 

Λιγη βοηθεια. Ευχαριστω πολυ

[Vamvakaris21]

δοκίμασε με fat arrow function και θα παίξει 

https://codecraft.tv/courses/angular/es6-typescript/arrow/

[vadou]

Χωρίς να μπορώ να κάνω debug, παρατηρώ τα εξής:
α) Δεν ορίζεις πουθενά την getDetails. Μπορεί να πιστεύεις ότι την ορίζεις, αλλά στη js τουλάχιστον, δεν ορίζεται έτσι μια συνάρτηση και δε νομίζω να αλλάζει ο τρόπος ορισμού της συνάρτησης στην typescript. Αν κάνω λάθος δες το β.
β) Για να δουλέψει ο κώδικας που έχεις γράψει, και χωρίς να μπορώ να δω τι άλλο κώδικα έχεις, θα πρέπει το 'this' στον eventHandler του selectClick να είναι το window και η getDetails να είναι global. Ή αν όλο αυτό που έχεις γράψει είναι σε μια κλάση, θα πρέπει το this να αναφέρεται στο αντικείμενο στο οποίο ανήκει η getDetails() - σε αυτή την περίπτωση δες τι context έχει το this και αν είναι λάθος, δώσε του σωστό context είτε με arrow function που λέει και το παιδί από πάνω είτε με apply/bind.

 

Δε μπορώ να  υποθέσω κάτι άλλο με αυτό που έχεις παραθέσει.

Επεξ/σία 2 Αυγούστου 2018 από vadou

[slevinkelevra]

Ναι, ολο αυτο, μαζι με την ngOnInit  ειναι μεσα σε μια κλαση 

 

export class myComponent {
  //ngOnInit
  //other code
}

και δουλεψε με arrow function -thanks Vamvakaris. Ηταν ενα απλο θεμα context και οχι scope (ακομα και σ αυτο εκανα λαθος). Απλα απο κεκτημενη ταχυτητα νομιζα οτι υπαρχει καποιο θεμα συνδυασμου angular και του πιο δυστροπου και γκαντεμικου API ολων των εποχων, του openlayers. 

Οκ, τυπικα θα μπορουσα να βαζω πχ private μπροστα απο την οποια getDetails, εχεις δικιο σ αυτο. 

To πιο περιεργο ειναι οτι μου απαντησε κοσμος μεσα σε ελληνικο φορουμ ενω εχει ηδη μπει Αυγουστος. Παιδια, ειμαστε ολοι καλα? Εσεις πως και μεσα?  😃😋