我目前处于初学者级别的javascript和angular.js框架。
我的问题是我不能让ngResource
工作。
我的代码:
JS:
var geolocationControllers = angular.module('geolocationControllers', ['ngResource']);
geolocationControllers.controller('geolocationControllers', ['$scope', '$resource',
function($scope, $resource) {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
$scope.$apply(function() {
$scope.position = $resource('http://nominatim.openstreetmap.org/reverse?format=json', {}, {
query: {
method: 'GET',
params: {
lat: position.coords.latitude,
lon: position.coords.longitude
}
}
});
console.log($scope.position);
});
});
}
}
]);
HTML:
<div class="container" ng-controller="geolocationControllers">
<label for="location">Your location:</label>
<input type="text" id="location" size="120" ng-model="position"/>
</div>
这输出到控制台并且也在输入元素中:
function Resource(value) { shallowClearAndCopy(value || {}, this); }
答案 0 :(得分:1)
你可以这样做......这样可行,我在浏览器中测试过......你必须重命名你需要的部分......
<强> HTML 强>
<!DOCTYPE HTML>
<html ng-app="myApp">
<head>
<meta charset="utf-8">
<title>untitled</title>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="app.js"></script>
</head>
<body ng-controller="myController">
<label for="location">Your location:</label><br>
<input type="text" id="location" size="120" ng-model="positionText"/>
</body>
</html>
和Javascript
var myApp = angular.module('myApp', []);
myApp.controller('myController', function ($scope, $http) {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (curPosition) {
var curLongi = curPosition.coords.longitude;
var curLati = curPosition.coords.latitude;
$http.get('http://nominatim.openstreetmap.org/reverse?format=json&lat='+curLati.toString()+'&lon='+curLongi.toString()).success(function (data) {
alert(JSON.stringify(data));
$scope.positionText = data.display_name;
});
});
}
});