这是我的控制人员:
angular.module('myApp')
.controller('HomeController', ['$scope', '$geolocation', function($scope, $geolocation) {
$geolocation.getCurrentPosition({
timeout: 6000
}).then(function(position) {
$scope.position = position;
$scope.myText = 'Text to show';
console.log(position);
console.log($scope.position);
})
}
])
在模板中:
{{ position }} <br/>
{{ myText }}
现在,在我的控制台中,我得到了这个对象
Geoposition {coords: Coordinates, timestamp: 1476965809589}
该位置的标志
在模板中,我明白了:
{}
Text to show
那么,为什么$scope.position
未显示在我的模板中,尽管Text to show
显示,并且控制台日志确认$scope.position
可用?
我的home.html
:
<div class="small-12 columns">
<div class="callout clearfix" style="margin-top:20px;">
<h5 class="float-center">Welcome Home.</h5>
{{ position }} <br/>
{{ myText }}
<div ng-show="!position" class="float-center">
<div class="loader">
<span>{</span><span>}</span>
</div>
</div>
</div>
</div>
并声明:
$stateProvider
.state('home', {
url: '/',
templateUrl: 'home/home.html',
controller: 'HomeController'
})
答案 0 :(得分:1)
Okay, I figured it out.
Had to to this, as in be specific with what I want from the position
object
<div class="callout clearfix" style="margin-top:20px;">
<h5 class="float-center">Welcome Home.</h5>
{{ position.timestamp }} <br/>
{{ position.coords.latitude }} <br/> // this works
{{ myText }}
<div ng-show="!position" class="float-center">
<div class="loader">
<span>{</span><span>}</span>
</div>
</div>
</div>