Put latitude into a form field


#1

I am working on a project where I get the coords of the phone. I want to put latitude and longitude into two form fields, but if i put {{ lat }} into the form fields value, I get an error “Expression has changed after it was checked”.
If I put into the placeholder, there is no problem.

How should it be solved?


#2

What this error can generally be translated to is “control fight”. Make sure you only have one binding managing each form field (such as formControlName, [(ngModel)], [value]) . If you have more than one, they’ll fight one another.


#3

I think I only have one. I guess the problem is that the form is rendered when the page is loaded, but the coordinates at found after the page is loaded. But shouldn’t it be possible to add a value to a form field after it is loaded?


#4

I can’t say any more without seeing code.


#5

What part of the code do toy wanna see?

public toastCtrl : ToastController
) {
this.form = formBuilder.group({
title: [’’, Validators.compose([Validators.maxLength(30), Validators.pattern(’[a-zA-Z0-9 ]’), Validators.required])],
place: [’’, Validators.compose([Validators.maxLength(30), Validators.pattern(’[a-zA-Z0-9 ]
’), Validators.required])],
description: [’’, Validators.compose([Validators.maxLength(30), Validators.pattern(’[a-zA-Z0-9 ]’), Validators.required])],
latitude: [’’, Validators.compose([Validators.maxLength(30), Validators.pattern(’[A-Za-z0-9 _.,!]
’)])]
});
}

And the coords part:
ionViewDidLoad() {
this.geo.getCurrentPosition().then( pos => {
this.lat = pos.coords.latitude;
this.lng = pos.coords.longitude;
}).catch( err => console.log(err));
this.loadMap();
}

And the field part from the new.html file.

Lat

<ion-input
type=“text”
value=""
formControlName=“latitude”
[(ngModel)]=“technologyLat”>

Is that enough?


#6

After that getCurrentPosition() resolves, you should be calling setValue on the latitude/longitude controls.

I see all three.


#7

Now I got it.

this.form.controls[“latitude”].setValue(pos.coords.latitude);

Thanks.