ng-map:设置缩放级别时无法读取undefined属性'apply'

Question

我在angularjs应用程序中使用ngMap.当我尝试在地图元素上设置缩放时,我遇到了错误.以下是Chrome控制台的错误消息:

 TypeError: Cannot read property 'apply' of undefined
    at Wk.eventFunc (ng-map.js:205)
    at Object.T.trigger (main.js:18)
    at kf (main.js:22)
    at Wk.N.set (main.js:21)
    at Wk.setZoom (main.js:29)
    at ng-map.js:1568
    at angular.js:6837
    at forEach (angular.js:323)
    at Object.$get.Attributes.$set (angular.js:6835)
    at interpolateFnWatchAction (angular.js:8157)

当我的map元素的zoom属性触发时:

<map center="{{initCenter.lat}}, {{initCenter.lng}}" zoom="{{zoom}}" on-dragend="dragend()" on-zoom_changed="zoomchanged()">

被绑定到我的角度控制器:

app.controller("mapCtrl", function ($scope, $location, dataContext) {
    $scope.markers = [];

    $scope.initCenter = dataContext.center();
    $scope.zoom = dataContext.zoom();

dataContext是一种在应用程序中公开各种状态变量的服务.我也尝试通过函数设置$ scope.zoom,产生相同的错误.

错误发生在ng-map.js文件的第1568行:

    var observeAndSet = function(attrs, attrName, object) {
  attrs.$observe(attrName, function(val) {
    if (val) {
      void 0;
      var setMethod = parser.camelCase('set-'+attrName);
      var optionValue = parser.toOptionValue(val, {key: attrName});
      void 0;
      if (object[setMethod]) { //if set method does exist
        /* if an location is being observed */
        if (attrName.match(/center|position/) && 
          typeof optionValue == 'string') {
          _this.getGeoLocation(optionValue).then(function(latlng) {
            object[setMethod](latlng);
          });
        } else { 
          // this is the line that causes the problem
          object[setMethod](optionValue);
        }
      }
    }
  });
};

在试图追踪正在发生的事情时,我按照执行设置中心和设置缩放(设置中心不会导致问题).设置中心执行第1568行并继续其快乐方式.

设置缩放(通过setZoom函数)会导致ng-map.js中第196行的代码执行:

      var eventFunc = function(attrValue) {
    var matches = attrValue.match(/([^\(]+)\(([^\)]*)\)/);
    var funcName = matches[1];
    var argsStr = matches[2].replace(/event[ ,]*/,'');  //remove string 'event'

    var args = scope.$eval("["+argsStr+"]");
    return function(event) {
      function index(obj,i) {return obj[i];}
      var f = funcName.split('.').reduce(index, scope);
      // this next line causes an exception in google map main.js
      f.apply(this, [event].concat(args));
      scope.$apply();
    }
  }

第205行导致异常,导致谷歌地图的main.js文件中的错误.

知道是什么导致了这个吗？以及如何解决它:)？

可能解决方案

更多地玩这个我注意到它没有设置缩放级别本身导致问题.它实际上是<< zoom'更改后的zoomchanged事件触发>>的结果.

第一次在地图上设置缩放,第204行:

var f = funcName.split('.').reduce(index, scope);

评估为null.我不确定为什么会这样,因为我不明白那条线在做什么.

然而,未来对缩放的改变使得相同的行204解析为f的非空值.

因此,作为一种解决方法,我将第205行和第206行括起来,如下所示:

  if (f != null) {
      f.apply(this, [event].concat(args));
      scope.$apply();
  }

并且错误消失了.

Answer 1

我认为这与这个问题有同样的问题，https://github.com/allenhwkim/angularjs-google-maps/issues/181

随着 1.7.7 的发布，这个问题得到了解决。

我使用$timeout，而不是$apply。