Modify an object's variable value after submiting form in Angular2

Question

I'm trying to modify an object latitude and longitude values after I submit the form because after submiting it I need to pass a geocode function to it's address.

I'm using this function to modify the lat and lng:

setLanLon(address : string){
this.getLatLon(address).subscribe(
            data => {
                this.foo.lat= data.lat();
                this.foo.lng= data.lng();
            },
            error => {
                console.log(error);
            });
}

And the function that is called on the form submit and in which I'm calling the function that modifies the values is this one:

edit() {
    this.setLanLon(this.foo.address);
    this.service.update(this.foo)
        .subscribe(
            data => {
                this.router.navigate(['/home']);
            },
            error => {
                console.log(error);
            });
}

But the lat and lng values that I receive in the service are the original values not the ones I modify with my function. What am I doing wrong here? Thanks in advance.

What's up with data.lat() and data.lng(), shouldn't it be just data.lat and data.lng, or how does your response look like? And your update-method is fired before foo has been manipulated. Try executing the method after setting the new values: .... this.foo.lng= data.lng; this.service.update(this.foo).... — AVJT82
– AVJT82, Commented Feb 19, 2017 at 13:26

AVJT82 · Accepted Answer · 2017-02-19 13:40:24Z

2

this.service.update(this.foo)

is executed before the

this.setLanLon(this.foo.address);

has finished executing and setting the new values for foo, therefore the old values are sent.

Secondly, check what response you are actually getting from setLanLon so you have the correct values set.

So try this:

edit() {
  this.setLanLon(this.foo.address);
}

setLanLon(address : string){
  this.getLatLon(address).subscribe(
     data => {
        this.foo.lat= // check response what to assign
        this.foo.lng= // check response what to assign
        this.service.update(this.foo)
          .subscribe(
             data => {
               this.router.navigate(['/home']);
             },
             error => {
               console.log(error);
            });
     },
     error => {
        console.log(error);
     });
}

answered Feb 19, 2017 at 13:40

AVJT82

73.6k25 gold badges146 silver badges170 bronze badges

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

2 Comments

Ayane Over a year ago

The problem was as u said that my update method was fired before updating the values i changed it like u said and now it works. The response from getLanLon was fine. Thanks for your time.

AVJT82 Over a year ago

Okay great. Glad I could help! :) Happy coding!

Collectives™ on Stack Overflow

Modify an object's variable value after submiting form in Angular2

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related