我正在使用 Ionic/Angular JS 构建一个新应用程序。在特定的应用程序选项卡中,我使用地理位置来填充 4 个字段(街道名称、街道号码、纬度和经度)。
这是我的 Controller JS 对于这个特定选项卡的样子:
.controller('PetitionsCtrl', function($scope, $cordovaGeolocation, $log) {
var posOptions = {timeout: 10000, enableHighAccuracy: false};
$cordovaGeolocation
.getCurrentPosition(posOptions)
.then(function (position) {
$scope.lat = position.coords.latitude;
$scope.lng = position.coords.longitude;
$log.log($scope.lat);
$log.log($scope.lng);
$scope.pLat = {value: $scope.lat};
$scope.pLng = {value: $scope.lng};
var geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng($scope.lat, $scope.lng);
var request = {
latLng: latlng
};
geocoder.geocode(request, function(data, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (data[0] != null) {
$log.log("Strada: " + data[0].address_components[1].long_name);
$log.log("Numar: " + data[0].address_components[0].long_name);
$log.log("Localitate: " + data[0].address_components[2].long_name);
$log.log("Adresa: " + data[0].formatted_address);
$scope.pStreet = {value: data[0].address_components[1].long_name};
$scope.pNumber = {value: data[0].address_components[0].long_name};
} else {
$log.log("Adresa indisponibila");
}
}
})
});
})
HTML 部分如下所示:
<label class="item item-input">
<span class="input-label">Strada</span>
<input type="text" ng-model="pStreet.value">
</label>
<label class="item item-input">
<span class="input-label">Număr</span>
<input type="text" ng-model="pNumber.value">
</label>
<label class="item item-input">
<span class="input-label">Lat</span>
<input type="text" ng-model="pLat.value">
</label>
<label class="item item-input">
<span class="input-label">Lng</span>
<input type="text" ng-model="pLng.value">
</label>
现在如你所见,我正在使用 $log
在控制台中显示信息。现在奇怪的部分来了......在控制台中,我正确显示了所有信息。另外,<input type="text" ng-model="pLat.value">
和<input type="text" ng-model="pLng.value">
字段已填充,但未 <input type="text" ng-model="pStreet.value">
和<input type="text" ng-model="pNumber.value"
> 尽管正如我之前所说,控制台向我显示了正确的值。比这更奇怪的是,如果我转到应用程序中的另一个选项卡并返回到此选项卡,所有字段都会正确填充。 我能做什么?我在这里做错了什么?
最佳答案
将值分配给 $scope.pStreet 和 $scope.pNumber 后使用 $scope.$apply()。
关于javascript - Ionic/Angular JS - 使用地理位置后输入字段未正确更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40367111/