Angular 2 Konstruktor ngOnInit undefined Eigenschaft TypeScript

Question

Ich versuche, den Wert eines Objekts aus Daten zu initialisieren, die von einem (Firebase) Datenspeicher zurückgegeben werden. Ich kann sehen, dass die Daten zurückgegeben werden, aber ich kann sie keiner lokalen Variablen zuweisen. Ich lehre mich Typoskript, Angular 2 und Firebase, so könnte dies eine ‚duh‘ Frage ...

import ProfileProvider from ../providers/profile 

@Component({...}) 
class Profile { 
userProfile:any 

constructor (public profileProvider: ProfilePRovider) {} 

ngOnInit() { 
    this.profileProvider.getUSerProfile().on ("value", function(snap) { 
    console.log(snap.val()); // this works, prints all my data correctly 
    this.userProfile = snap.val(); // this fails, "cannot set property userProfile of undefined" 
    } 
} 
} 

Jede Hilfe ist willkommen! Danke!

Answer 1

Dies liegt daran, this bezieht sich nicht auf die Komponente selbst. Entweder binden die Funktion oder verwenden fat arrow => Funktion:

...getUserProfile().on('value', function(snap){ 
    }.bind(this)) 

oder

...getUserProfile().on('value', snap => { 
    // this is properly bound here 
    });