Angular 2 Constructor ngOnInit undefined property TypeScript

Question

I am trying to initialize an object's value from data returned from a (Firebase) data store. I can see the data being returned, but i cannot assign it to a local variable. I am teaching myself TypeScript, Angular 2 and Firebase, so this might be a 'duh' question...

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"
   }
 }
}

Any help is appreciated! Thanks!

this also How to properly do a “bind” in angular2 typescript? — Max Koretskyi
– Max Koretskyi, Commented Aug 7, 2017 at 13:39

mxr7350 · Accepted Answer · 2017-08-07 14:22:46Z

3

This is because this does not refer the component itself. Either bind the function or use fat arrow => function:

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

or

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

edited Aug 7, 2017 at 14:22

mxr7350

1,4543 gold badges23 silver badges31 bronze badges

answered Aug 7, 2017 at 13:36

Meir

14.4k4 gold badges44 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

banncee Over a year ago

Thank you! I'm new to JavaScript / Type Script, this was driving me crazy... Not a fan of either language...

Meir Over a year ago

Well, be patient, you'll get it and enjoy it.

banncee Over a year ago

I may eventually get it, I'm not sure I'll enjoy it... :)

Collectives™ on Stack Overflow

Angular 2 Constructor ngOnInit undefined property TypeScript

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related