Javascript AngularJS+；谷歌地图没有显示标记

我在$scope.mapscreated上有一个标记可以正常工作。现在，当用户单击$scope.centerOnMe（）时，我尝试显示另一个标记，但只有当前位置显示，没有标记

我必须使用还是有最简单的解决方案

控制器

.controller('mapCtrl', ['$scope', '$state', '$ionicLoading', function($scope, $state, $ionicLoading){

$scope.mapCreated = function(map) {

    var latlngPlace = new google.maps.LatLng(-27.4264356, -51.7838787);
    var marker = new google.maps.Marker({
        map: map,
        position: latlngPlace
    });

    $scope.map = map;
};

$scope.centerOnMe = function () {
console.log("Centering");
if (!$scope.map) {
  return;
}

$scope.loading = $ionicLoading.show({
  content: 'Wait...',
  showBackdrop: false
});

navigator.geolocation.getCurrentPosition(function (pos) {
  console.log('Got pos', pos);

  $scope.map.setCenter(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));

    var myPlace = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);

    var marker2 = new google.maps.Marker({
        position: myPlace
    });


  $ionicLoading.hide();

}, function (error) {

    console.log('Error' + error.message)
});
};    

}])

指令.js

angular.module('app.directives', [])

.directive('map', function(){

return {
restrict: 'E',
scope: {
  onCreate: '&'
},
link: function ($scope, $element, $attr) {
  function initialize() {
    var mapOptions = {
      center: new google.maps.LatLng(-27.426102, -51.784999),
      zoom: 16,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map($element[0], mapOptions);

    $scope.onCreate({map: map});

    // Stop the side bar from dragging when mousedown/tapdown on the map
    google.maps.event.addDomListener($element[0], 'mousedown', function (e)  {
      e.preventDefault();
      return false;
    });
  }

  if (document.readyState === "complete") {
    initialize();
  } else {
    google.maps.event.addDomListener(window, 'load', initialize);
  }
}
}

});

map.html

<ion-view title="Map" id="page9" style="background-color:#FFFFFF;">
<ion-content>
    <map on-create="mapCreated(map)"></map>
</ion-content>
<ion-footer-bar class="bar-stable bar-calm">
  <a ng-click="centerOnMe()" class="button button-icon icon ion-navigate">FindMe</a>
</ion-footer-bar>
</ion-view>

FindMe

您可以在

centerOnMe（）函数中创建一个新标记。下面是创建新标记的示例。这是创建标记的唯一方法

$scope.centerOnMe = function () {
  console.log("Centering");
  // Adding a new marker
  var marker1 = new google.maps.Marker({
    map: $scope.map,
    position:  new google.maps.LatLng(lat, lng);
  });

  if (!$scope.map) {
     return;
  }
}

它只是缺少映射：$scope.map

var myPlace = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);

var marker2 = new google.maps.Marker({
    map: $scope.map,
    position: myPlace
});

它并没有以这种方式工作，但感谢您显示map的部分：$scope.map