typescript logic issue with angular 2 and google maps api

Question

i am trying to create a function to get the location value to pass it to all the components using shared service below is my ngOnInit function

   this.input = document.getElementById('google_places_ac');
        var autocomplete = new google.maps.places.Autocomplete(this.input, { types: ['(cities)']});
        google.maps.event.addListener(autocomplete, 'place_changed', function () {
            var place=autocomplete.getPlace();
           this.setValue(place.address_components[3].long_name, place.address_components[2].long_name, place.address_components[1].long_name);

         });

the problem is that it doesn't recognize this.setvalue function which shares value with my shared service or any variable with this.variable , its javascript "this" issue . and i can not even get this function to work with my constructor, it throws error at getElmentById.

there are solutions with arrow functions and all but i dont know how to use it in this condition so please help me..

Dr.Molle · Accepted Answer · 2016-04-03 15:21:30Z

1

Inside the place_changed-callback the keyword this points to the Autocomplete-instance.

You'll need to create a closure:

var instance    = this, 
    autocomplete;
instance.input  = document.getElementById('google_places_ac');
autocomplete    = new google.maps.places.Autocomplete(instance.input, { 
                     types: ['(cities)']});

google.maps.event.addListener(autocomplete, 'place_changed', function () {
   var place=this.getPlace();
   instance.setValue(place.address_components[3].long_name,          
                     place.address_components[2].long_name, 
                     place.address_components[1].long_name);
});

answered Apr 3, 2016 at 15:21

Dr.Molle

117k16 gold badges200 silver badges206 bronze badges

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

2 Comments

Ironsun Over a year ago

var instance = this; is working , i am not getting any errors but its not updating values on the view should i create a new question for this or should i update question with my sharedservice function?

Ironsun Over a year ago

hi i have created new question if you can help me tehre it wil be great stackoverflow.com/questions/36387480/…

Collectives™ on Stack Overflow

typescript logic issue with angular 2 and google maps api

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related