uiGmapIsReady work only once?

[Grandiz]

Hi. I tryed to write directive for route direction.
I use directive on location /order/create/step1. When i went to another location, for example /order/create/step2 and back to the step1, it didn't show routes and didnts;t print console.log('uiGmapIsReady');

.directive('uiGmapRoutes', function(uiGmapIsReady, GoogleError){

    var directionsDisplay, directionsService;

    uiGmapIsReady.promise(1).then(function(instances) {
      console.log('uiGmapIsReady');
      directionsDisplay = new google.maps.DirectionsRenderer({suppressMarkers : true});
      directionsService = new google.maps.DirectionsService();
      directionsDisplay.setMap(instances[0].map);
    });


      return {
        scope: {
          points: '='
        },
        controller: function($scope){
          //watch when points changed
          $scope.$watchCollection('points', function(newPoints){
            if(_.size(newPoints) >= 2 && _.last(newPoints).coords){

              var request = {
                origin: new google.maps.LatLng(_.first(newPoints).coords.latitude, _.first(newPoints).coords.longitude),
                destination: new google.maps.LatLng(_.last(newPoints).coords.latitude, _.last(newPoints).coords.longitude),
                travelMode: google.maps.TravelMode.DRIVING
              };

              if(_.size(newPoints) > 2){
                request.waypoints = [];
                _.each(newPoints, function(point, index){
                  if(index != 0 && index < _.size(newPoints) - 1){
                    request.waypoints.push({
                      location: new google.maps.LatLng(point.coords.latitude, point.coords.longitude),
                      stopover:true
                    })
                  }
                });
              }

              directionsService.route(request, function(response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                  directionsDisplay.setDirections(response);
                }else{
                  GoogleError.direction(status);
                }
              });
            }
          })
        }
      };
  })

and by the way, in this case

if (status == google.maps.DirectionsStatus.OK) {
                  directionsDisplay.setDirections(response);
                }

i print directionDisplay and reponse, and it wasn't empty

the same issue if open page on / and click on url with is reffer to /order/create/step1

[nmccready]

Well if you only need one map instance then use the uiGmapGoogleApi service it also has ready type functionality. I am not saying your problem isn't real, but that is a work around.

[BMo-design]

Aha, have the same issue. Can you give me a hint how to use the workaround?

[0101adm]

+1

i cannot use uiGmapGoogleApi because i need to get the map bounds() from the instance.

[xkjyeah]

Hi if anyone is interested, try PR #1795

[grtjn]

In addition to the above, I kinda dislike the fact you need to predict the number overall instances of all the gmaps you have around. It also makes it hard to target just one of them if you have multiple, potentially in various different parts of your app. I bypassed it in a similar way as the above mentioned PR, but outside the package. I provided a control property to the map directive, and watch that like this:

    <ui-gmap-google-map control="control" ...>

    $scope.control = {};
    $scope.$watch('control.getGMap', function(getGMap) {
        if (getGMap) {
            $scope.gmap = getGMap();
        }
    });