angular-google-maps icon indicating copy to clipboard operation
angular-google-maps copied to clipboard

Angular google map search box doesn't work on single click. required long press on result to work.

Open preetam-yadav opened this issue 9 years ago • 1 comments

I have implemented angular google map in my ionic app.and its working fine but for search places we used angular google map search box .when we search like Gurgaon india its show results but when i click on any one then map don,t moving to that location .and when i long press to result then it works.

can u please help me .i need to work on click.

here is my code:

html file:

<script id="searchbox.tpl.html" type="text/ng-template">
 <input type="text" class="card searchbar" placeholder="Search" id="pac-input" 
 data-tap-disabled="true" ng-change='disableTap()' ng-model="search" autocomplete="true" />
<label><i class="ion-ios-search"></i></label>
</script>
<ui-gmap-google-map center='map.center' draggable="true" zoom='map.zoom' options="map.options" control="map.control">
  <ui-gmap-markers models="RefresherObj" coords="'location'" idKey="'_id'" options="partnerPointer" icon="'icon'" ></ui-gmap-markers>
  <ui-gmap-search-box template="searchbox.template" events="searchbox.events" data-tap-disabled="true"></ui-gmap-search-box>
<ui-gmap-marker idKey="marker.id" coords="marker.coords"  options="marker.options"  icon="'icon'" events="marker.events"></ui-gmap-marker>
</ui-gmap-google-map>

controller:

angular.extend($scope, { searchbox: { template: 'searchbox.tpl.html', events: { click: function(searchbox, eventName, originalEventArgs) { console.log("searchbox",searchbox); console.log("eventName",eventName); console.log("originalEventArgs",originalEventArgs); console.log("originalEventArgs", originalEventArgs[0]); }, places_changed: function(searchbox, eventName, originalEventArgs) { console.log("searchbox1",searchbox.getPlaces()); console.log("eventName2",eventName); console.log("originalEventArgs2",originalEventArgs); showLoader(); var place = searchbox.getPlaces(); var newCenter = { latitude: place[0].geometry.location.lat(), longitude: place[0].geometry.location.lng() } $scope.marker = { coords: { latitude: place[0].geometry.location.lat(), longitude: place[0].geometry.location.lng() }, options: { draggable: true, icon: 'img/marker.png' } }

        console.log("place", newCenter);
        $scope.map.control.refresh(newCenter);
        $ionicLoading.hide();
      }
    }
  }
});

preetam-yadav avatar Jul 16 '16 13:07 preetam-yadav

I had the same issue in my project at repo referenced above: https://github.com/werdnanoslen/gleanhub/search?utf8=%E2%9C%93&q=searchbox

Resolved with this: http://stackoverflow.com/a/36739953

werdnanoslen avatar Oct 07 '16 01:10 werdnanoslen