Angularjs在获得指令输出后将值分配给控制器

我对angularjs和googlemaps非常陌生，请帮助我。Angularjs在获得指令输出后将值分配给控制器

我的HTML文件：

<body ng-app="myApp" ng-controller="carLocationCtrl"> 

    <div my-map=""></div> 
    <p>{{myCurrentPosition}}</p> 
    <script type="text/javascript" src="E:\Projects\Angular Projects\angularmap.js"></script> 

</body>

在这里，我想从我的指令的currentPosition值然后传递或指派该值在我的控制变量myCurrentLocation.then只有我能在我的<p>显示此值标签。

我的控制器：

var OEMControllers=angular.module('myApp',[]); 

    OEMControllers.controller('carLocationCtrl', ["$scope", "$rootScope", function ($scope, $rootScope) { 
    $scope.isEditLocation = false; 
    $scope.myCurrentLocation=''; 
    $scope.saveCarLocation = function() { 
     $scope.isEditLocation = true; 
    }; 
    $scope.editCarLocation = function() { 
     $scope.isEditLocation = false; 
    }; 
    }]).directive('myMap', function() { 

    var link = function(scope, element, attrs) { 
     var map, infoWindow; 
     var markers = []; 

     // map config 
     var mapOptions = { 
      center: new google.maps.LatLng(50, 2), 
      zoom: 4, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      scrollwheel: false 
     }; 

     // init the map 
     function initMap() { 
      if (map === void 0) { 
       map = new google.maps.Map(element[0], mapOptions); 
      } 
     }  

     // place a marker 
     function setMarker(map, position) { 
      var marker; 
      var markerOptions = { 
       position: position, 
       center:position, 
       map: map, 
       icon: 'https://maps.google.com/mapfiles/ms/icons/green-dot.png' 
      }; 

      marker = new google.maps.Marker(markerOptions); 
      markers.push(marker); // add marker to array 

      //pan to marker.. 
      console.log('marker.getPosition() :: '+marker.getPosition()); 
      map.panTo(marker.getPosition()); 
      map.setZoom(16); 
      console.log('pan called'); 

    //here i can able to get my currentPosition but how can i send this value to my controller ......... 

    scope.myCurrentLocation=marker.getPosition(); 

    console.log('output :: '+scope.myCurrentLocation); 

     } 

     // show the map and place some markers 
     initMap(); 
     getLocation(); 

     var watchID=null; 
     function getLocation() { 
      if (navigator.geolocation) { 
       navigator.geolocation.getCurrentPosition(onSuccess); 

       /* var options = { timeout: 30000 }; 
        watchID = navigator.geolocation.watchPosition(onSuccess, onError, options);*/ 

     } else { 
       console.log('Not obtain geolocation'); 
     } 
    } 

    //geolocation succes.. 

     function onSuccess(position) { 

      console.log('lat :: '+position.coords.latitude); 
      console.log('long :: '+position.coords.longitude); 


       setMarker(map, new google.maps.LatLng(position.coords.latitude, position.coords.longitude)); 
       } 

       function onError(error) 
       { 
        console.log(error.message); 
       } 

    }; 

    return { 
     restrict: 'A', 
     template: '<div id="gmaps"></div>', 
     replace: true, 
     link: link 
    }; 
    });

来源

2015-04-03 user3668984

在这里，你需要一个孤立的范围添加到您的“我的地图”指令，并采取“myCurrentLocation”从控制器到指令引用如下：

在链接功能将如下返回：

return { 
    restrict: 'A', 
    template: '<div id="gmaps"></div>', 
    replace: true, 
    scope : { 
     location : "=" 
    } 
    link: link 
};

在向链路功能，无论你更改标记位置保存如下指令范围的位置（M。 AKE确保您使用您已在隔离范围上面使用该步骤中的属性名）：

scope.location=marker.getPosition();

而且您的HTML文件看起来像：

<body ng-app="myApp" ng-controller="carLocationCtrl"> 

    <div my-map="" location="myCurrentLocation"></div> 
    <p>{{myCurrentLocation}}</p> 
    <script type="text/javascript" src="E:\Projects\Angular Projects\angularmap.js"></script> 

</body>

来源

2015-04-03 10:14:43

工作，我也跟着这一点，在我的代码进行了更改，但仍它不工作.... – user3668984 2015-04-06 06:42:06

赋值给范围对象。（我认为你已经在代码中做到了这一点）。
angular使用级联/扩展范围，因此任何在子元素中声明的控制器仍然可以读取已分配的值。您可以通过ng-model或ng-bind直接访问它们。
你可能想实例化一个服务/值（单例），并使指令以及控制器依赖于它。现在，您在指令中分配的值可供所有依赖于服务/值的人访问。

来源

2015-04-03 10:15:37

我觉得你的代码，它确定，但在你的HTML你用错变量名称，比如“myCurrentPosition”，我认为这将与“myCurrentLocation”

来源

2015-04-03 10:26:41

Angularjs在获得指令输出后将值分配给控制器

回答

相关问题