Google API for Map无法使用角度JS $ scope.data输入

时间:2014-10-20 15:15:39

标签: javascript angularjs google-maps google-maps-api-3 google-api

我有以下角度脚本。我面临的问题是我在http请求的成功方法中收到的数据的数据类型。已接收的数据用于使用可用的javascript在谷歌地图上显示当前位置。问题是,位置标记和地图没有显示经度和收到的纬度。但是,如果我硬编码并传递静态值(静态输入被注释),则会显示地图和位置标记。请帮我解决这个问题。非常感谢。

var app = angular.module("myApp", []);

app.controller("myCtrl",function ($scope,$rootScope,$http) {    
      var city = 'Mumbai';
      $scope.uploadResultFinal= false;

      $http({
          method: 'POST', 
          url: '\HomeServlet2',
          headers: {
             'Content-Type': 'application/json'
          },   
          params: {
             City:city
          }
      });
      .success(function(data) {
          console.log(angular.toJson(data));                    
          $scope.data1= data.Addresses;
          $scope.latlang =[$scope.data1[2].Latitude,$scope.data1[2].Longitude];
          $scope.uploadResultFinal= true;
      })
      .error(function(data, status, header, config) {
          console.log('Error');
      });



      $scope.$watch('uploadResultFinal', function() {
          alert($scope.latlang[0]);
          alert($scope.latlang[1]);
          var l1 =$scope.latlang[0]; 
          var l2 =$scope.latlang[1]; 
          /* static values are commented.*/
          /*
          var l1= "19.72";
          var l2= "72.63";
          */
          var myCenter=new google.maps.LatLng(l1,l2);


          function initialize() {
              var mapProp = {
              center:myCenter,
              zoom:5,
              mapTypeId:google.maps.MapTypeId.ROADMAP
          };

          var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

          var marker=new google.maps.Marker({
            position:myCenter,
            animation:google.maps.Animation.BOUNCE
            });

          marker.setMap(map);

          var infowindow = new google.maps.InfoWindow({
            content:"You Are Here!"
          });

          infowindow.open(map,marker);
     }

        google.maps.event.addDomListener(window, 'load', initialize);


},true); 
   }
);

1 个答案:

答案 0 :(得分:0)

只是一个猜测,你可以尝试在成功&中添加$ scope。$ apply()。错误功能。或者更好地将.finally()添加到$ http。

.finally(function(){
    $scope.$apply();
})

希望它有所帮助。