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在獲得指令輸出後將值分配給控制器

回答

相關問題