我的应用需要获取路径(纬度和经度列表)才能在地图上显示。
我创建了一个执行所有api调用的基本控制器。
function mainController($scope, $http){
$http.get('/api/lastrun')
.success(function(data){
$scope.lastrun = data;
})
.error(function(data){
console.log('Error: ' + data);
});
}
lastrun有一个路径数组,可以让你访问每个位置。
我使用angular-leaf-directive
创建了一个mapControllerfunction mapController($scope, positionService){
angular.extend($scope, {
run: {
lat: 0.0,
lng: 0.0,
zoom: 4
},
path: {
p1: {
color: 'red',
weight: 2,
latlngs: [
{ lat: 51.50, lng: -0.082 }, //here is an example of lat and lng in this controller
{ lat: 48.83, lng: 2.37 },
{ lat: 0, lng: 7.723812 }
]
}
}
});
}
我想做的事似乎很容易。我只想在调用/ api / lastrun到latlngs中的mapController时把我得到的位置数组。
我对AngularJS中的服务并不完全熟悉,但我试图构建我的(positionService)。然而它没有用。
有没有人知道如何继续使用我的服务创建一个包含{lat:,lng:}列表的数组并将其调用到我的mapController中?
答案 0 :(得分:0)
我会做的:
$scope.lastrun = [];
$http.get('/api/lastrun')
.success(function(data){
angular.forEach(data, function (value) {
$scope.lastrun.push({lat : value.lat, lng : value.lng});
});
}
})
然后:
path: {
p1: {
color: 'red',
weight: 2,
latlngs: $scope.lastrun
}
希望这有帮助
答案 1 :(得分:0)
我终于找到了解决方案。我在我的服务中使用Adrien的解决方案,而不是在我的控制器中,然后将lastrunpos数组返回到我的mapController。这是我的代码:
var selftracking = angular.module('selftracking',["leaflet-directive"])
selftracking.service('positionService', function($http){
var lastrunpos = [];
$http.get('/api/lastrun')
.success(function(data){
angular.forEach(data.path, function (value) {
lastrunpos.push({lat : value.latitude, lng : value.longitude});
});
});
return {
getPos : function() {
return lastrunpos;
}
}
});
function mainController($scope, $http){
//Get all the last activities in the front page
$http.get('/api/lastactivity')
.success(function(data){
$scope.lastactivity = data;
})
.error(function(data){
console.log('Error: '+ data);
});
$http.get('/api/lastrun')
.success(function(data){
$scope.lastrun = data;
})
.error(function(data){
console.log('Error: ' + data);
});
}
function mapController($scope, positionService){
angular.extend($scope, {
run: {
lat: 51.505,
lng: -0.09,
zoom: 4
},
path: {
p1: {
color: 'red',
weight: 8,
latlngs: positionService.getPos()
}
}
});
}