Error getting document: TypeError: Cannot read property 'modal' of undefined

Ionic Framework ionic-v3
1

here is my function:

openModal(post) {
    
    var docRef = firebase.firestore().collection("posts").doc(post.id)
    docRef.get().then(function(doc) {
      if (doc.exists) {
          console.log("Document data:", doc.data())
          const myData = doc.data()
          console.log("My data:", myData)
          const mapModal = this.modal.create('MapPage', { data: myData });
          mapModal.present();
      } else {
          console.log("No such document!");
      }
    }).catch(function(error) {
        console.log("Error getting document:", error);
    });
  }

the function opens if I move rewrite it this way…although this way myData is undefined?!:

openModal(post) {
    
    var docRef = firebase.firestore().collection("posts").doc(post.id)
    docRef.get().then(function(doc) {
      if (doc.exists) {
          console.log("Document data:", doc.data())
          const myData = doc.data()
          console.log("My data:", myData)
          
      } else {
          console.log("No such document!");
      }
    }).catch(function(error) {
        console.log("Error getting document:", error);
    });
        const mapModal = this.modal.create('MapPage', { data: myData });
        mapModal.present();
  }