kh' kh' - 6 months ago 22
AngularJS Question

Display $scope doesn't works in my view

I'm trying to display a $scope value in my view but it doest'nt work.

My console.log with scope works.

Any idea ?

In my controller with Geolocation Plugin

.controller('geoCtrl', ['$scope', '$ionicPlatform', function($scope, $ionicPlatform) {
function updateLoc($scope)
{
$scope.latitude2 = "wow";
console.log("hello");
console.log($scope.latitude);
console.log($scope.longitude);
console.log($scope.speed);
}
$scope.findGeolocation = function() {
console.log("navigator.geolocation works");
var onSuccess = function(position) {
$scope.latitude = position.coords.latitude;
$scope.longitude = position.coords.longitude;
$scope.altitude = position.coords.altitude;
$scope.speed = position.coords.speed;
$scope.timestamp = position.timestamp;
console.log($scope.longitude);
updateLoc($scope);

};
function onError(error) {
alert('code: ' + error.code + '\n' +
'message: ' + error.message + '\n');

};
navigator.geolocation.getCurrentPosition(onSuccess, onError);
}
$ionicPlatform.ready(function() { $scope.findGeolocation(); })

}])


In my view

<ion-view view-title="APP">
<ion-content>
<div ng-controller="geoCtrl">
<p>Bonjour, {{ latitude2 }} </p>
<p id="speed">Finding speed...</p>
<p id="latitude">Finding latitude...</p>
<p id="longitude">Finding longitude...</p>
</div>
</ion-content>
</ion-view>


Thank you

Answer

The geolocation callback function is not running inside the scope - you need to tell angular that an update has been made. i.e.

        var onSuccess = function(position) {
            $scope.$apply(function() {
                $scope.latitude = position.coords.latitude;
                $scope.longitude = position.coords.longitude;
                $scope.altitude = position.coords.altitude;
                $scope.speed = position.coords.speed;
                $scope.timestamp = position.timestamp;
                updateLoc($scope);
            });
        };