我给我的地图拉特和lon,但是在地图上它并不接受它。 有人可以帮忙吗?
图片1:
图片2:
这是控制器:
angular.module('todoController', ['ngMap' , 'firebase'])
// inject the Todo service factory into our controller
.controller('mainController', ['$scope' , '$firebaseArray' , function($scope , $firebaseArray ,NgMap , $timeout ) {
// check the ng-map docs for api url and api key
$scope.mapsApiUrl = 'AIzaSyA3ZMA6KlxboXRuA7ItNNSlJp3xcgjaB0M';
$scope.$onInit = onInit;
函数onInit初始化地图
function onInit() {
NgMap.getMap().then(function (mapInstance) {
var center = mapInstance.getCenter();
google.maps.event.trigger(mapInstance, 'resize');
mapInstance.setCenter(center);
$timeout(function () {
$scope.map = mapInstance;
});
}) ; }
firebase参考
// CREATE A FIREBASE REFERENCE
var config = {
apiKey: "AIzaSyAKoDxaWtWmvnDAvMBwddPeGt16gRPzALg",
authDomain: "trackeur-backend.firebaseapp.com",
databaseURL: "https://trackeur-backend.firebaseio.com",
projectId: "trackeur-backend",
storageBucket: "trackeur-backend.appspot.com",
messagingSenderId: "981610558503"
};
firebase.initializeApp(config);
这是运行应用程序的功能
$scope.addTodo = function () {
var lat = firebase.database().ref().child('coordinates').child('lat');
var lon = firebase.database().ref().child('coordinates').child('lon');
setInterval(() => {
lat.on("value", function(snapshot) {
// This isn't going to show up in the DOM immediately, because
// Angular does not know we have changed this in memory.
// $scope.data = snapshot.val();
// To fix this, we can use $scope.$apply() to notify Angular that a change occurred.
$scope.$apply(function() {
$scope.data = snapshot.val();
});
});
lon.on("value", function(snapshot) {
// This isn't going to show up in the DOM immediately, because
// Angular does not know we have changed this in memory.
// $scope.data = snapshot.val();
// To fix this, we can use $scope.$apply() to notify Angular that a change occurred.
$scope.$apply(function() {
$scope.data1 = snapshot.val();
});
});
// here I provide the latitude and longitude to my map
console.log($scope.data +' , '+ $scope.data1 ) ;
$scope.coord ={
lat: $scope.data ,
lon: $scope.data1
} ;
}, 1000);
};
我的问题是我从firebase获得了纬度和经度但是当我将它们发送到我的HTML时它并没有标记我得到的坐标,实际上它根本没有移动,这里'是标记:
<marker position="[{{$coord.lat}} , {{$coord.lon}}] " icon="car2.png"></marker>
答案 0 :(得分:0)
最好在属性中仅使用一个双花括号,{{ }}
,interpolation:
<marker position="{{'['+data+','+data1+']'}}" icon="car2.png">
</marker>
这减少了模板中观察者的数量。
还使用已从异步块中应用的$scope
个变量。