2014-07-08 15 views
5

के साथ स्वत: पूर्ण स्थान रखता है मैं Google स्थानों को कोणीय जेएस के साथ स्वत: पूर्ण कार्य करने की कोशिश कर रहा हूं। यहां jsfiddle - 'place_change 'ईवेंट के बाद मॉडल अपडेट नहीं हो रहा है। यह इनपुट के परिवर्तन पर अद्यतन हो रहा है। एचटीएमएलGoogle कोणीय जेएस

<body ng-app="mapApp"> 
    <div ng-controller="MapController"> 
     <input id="from" type="text" ng-model="user.from" placeholder="Type Address" class="ng-pristine ng-valid" autocomplete="off"> 
     <input type="hidden" ng-model="user.fromLat"> 
     <input type="hidden" ng-model="user.fromLng"> 
      <p>{{user.from}} <br> {{'Latitude : ' + user.fromLat + ', Longitutde : ' + user.fromLng}}</p> 
    </div> 
</body> 

जावा स्क्रिप्ट

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

mapApp.controller('MapController', function ($scope) { 
    $scope.user = {'from': '', 'fromLat': '', 'fromLng' : ''}; 
    var options = { 
     componentRestrictions: {country: "in"} 
    }; 
    var inputFrom = document.getElementById('from'); 
    var autocompleteFrom = new google.maps.places.Autocomplete(inputFrom, options); 
    google.maps.event.addListener(autocompleteFrom, 'place_changed', function() { 
     var place = autocompleteFrom.getPlace(); 
     $scope.user.fromLat = place.geometry.location.lat(); 
     $scope.user.fromLng = place.geometry.location.lng(); 
     $scope.user.from = place.formatted_address; 
    }); 
}); 
+0

अपने jsFiddle लिंक काम नहीं लगती – rob

+0

अपडेट JsFiddle - http://jsfiddle.net/punchouty/cTD2a/6/ – Puja

+0

'वर inputFrom = document.getElementById ('से'); 'नियंत्रकों से सर्वोत्तम अभ्यास के कोणीय कोई डोम हेरफेर के खिलाफ है, है ना? हम इसे निर्देश के साथ कैसे प्राप्त कर सकते हैं? – sgimeno

उत्तर

5

आप कोणीय बताने के लिए जब place_change घटना निकाल दिया जाता है, तो यह डोम अद्यतन करने के लिए जब जानता है की जरूरत है -

नीचे दिए HTML कोड है। आप $scope.$apply() पर कॉल करके ऐसा कर सकते हैं। उदाहरण के लिए:

google.maps.event.addListener(autocompleteFrom, 'place_changed', function() { 
     var place = autocompleteFrom.getPlace(); 
     $scope.user.fromLat = place.geometry.location.lat(); 
     $scope.user.fromLng = place.geometry.location.lng(); 
     $scope.user.from = place.formatted_address; 
     $scope.$apply(); 
    }); 
+0

धन्यवाद लूट। इसने काम कर दिया :) – Puja