Question

我在模式中使用ng-map（http://ngmap.github.io/）在我的应用程序中提供googlemap，但在该指令中的异常后，我的页脚中的关闭按钮不起作用。当我在指令之前放置关闭按钮时（例如在标题中）它可以工作！我该如何捕捉这些例外并保持控制？

我的模态如下：

 <script type="text/ng-template" id="views/OfficeMapModal.html">
        <div class="modal-header">
            <div class="modal-title">{{address}}</div>
        </div>
        <div class="modal-body">
            <ng-map zoom="15" center="{{center.latitude}}, {{center.longitude}}">
                <marker position="{{center.latitude}}, {{center.longitude}}"></marker>
            </ng-map>
        </div>
        <div class="modal-footer">
            <div class="btn btn-default select-again" data-ng-click="cancel()">close</div>
        </div>
 </script>

我的模态控制器如下：

angular.module('portalApp').controller('GoogleMapModalController', ['$scope', 'NgMap', '$uibModalInstance', 'address', 'center', function ($scope, NgMap, $uibModalInstance, address, center) {
$scope.address = address;

$scope.center = center;

NgMap.getMap().then(function (map) {
    google.maps.event.trigger(map, 'resize');
    var myLatLng = new google.maps.LatLng(center.latitude, center.longitude);
    map.setCenter(myLatLng);
});

$scope.cancel = function () {
    $uibModalInstance.dismiss('cancel');
};}]);

编辑：

错误：未定义Google 吨@ http://localhost:3000/bower_components/ngmap/build/scripts/ng-map.min.js:1:2423

Answer 1

您正在调用方法getMap（），因此如果它在该方法中的任何地方失败而没有处理错误，则执行将不会继续。这意味着甚至不会声明$ scope.cancel。

如果您期望此库中存在错误，或者特别是在调用getMap（）的过程中，理想情况下您应该尝试解决这些错误。但是，在由于无法控制的条件而无法解决错误的情况下，保持取消按钮工作的最简单的解决方案是将$ scope.cancel声明移到NgMap初始化之上，试一试try并输出错误细节：

    angular.module('portalApp').controller('GoogleMapModalController', ['$scope', 'NgMap', '$uibModalInstance', 'address', 'center', function ($scope, NgMap, $uibModalInstance, address, center) {
    $scope.address = address;

   $scope.center = center;

   $scope.cancel = function () {
        $uibModalInstance.dismiss('cancel');
    };

   try { // safely attempt to initialize 
      NgMap.getMap().then(function (map) {
         google.maps.event.trigger(map, 'resize');
         var myLatLng = new google.maps.LatLng(center.latitude, center.longitude);
         map.setCenter(myLatLng);
      });
   } catch(err) { } // out put error
   }]);

在ng-map指令中发生异常后，Angular ng-click不起作用

1 个答案: