【问题标题】:Angular google map main controller error角度谷歌地图主控制器错误
【发布时间】:2016-11-19 10:51:24
【问题描述】:

我正在尝试使用“标记”在我的网站上获取 angular-google-maps。

这是我正在使用的代码: 控制器 main.js

angular.module('dashyAppApp')
    .factory("Markers", function(){
      var Markers = [
        {
          "id": "0",
          "coords": {
            "latitude": "45.5200",
            "longitude": "-122.6819"
          },
          "window": {
            "title": "Portland, OR"
          }
        },
        {
          "id": "1",
          "coords": {
            "latitude": "40.7903",
            "longitude": "-73.9597"
          },
          "window" : {
            "title": "Manhattan New York, NY"
          }
        }
      ];
      return Markers;
    });

    .controller('MainCtrl', function ($scope,Markers) {
      $scope.map = { 
        center: { latitude: 39.8282, longitude: -98.5795 }, 
        zoom: 4 
      };
      $scope.markers = Markers;
    });

这是我的观点 main.html

<ui-gmap-google-map 
          center='map.center' 
          zoom='map.zoom' aria-label="Google map">

          <ui-gmap-marker ng-repeat="marker in markers"
            coords="marker.coords" options="marker.options" events="marker.events" idkey="marker.id">
            <ui-gmap-window>
              <div>{{marker.window.title}}</div>
            </ui-gmap-window>
          </ui-gmap-marker>

        </ui-gmap-google-map>

我不断收到此错误:

markerwithlabel.js:71 Uncaught ReferenceError: google is not defined(anonymous function) @ markerwithlabel.js:71
infobox.js:116 Uncaught ReferenceError: google is not defined(anonymous function) @ infobox.js:116
keydragzoom.js:820 Uncaught ReferenceError: google is not defined(anonymous function) @ keydragzoom.js:820(anonymous function) @ keydragzoom.js:861
richmarker.js:60 Uncaught ReferenceError: google is not defined(anonymous function) @ richmarker.js:60
main.js:37 Uncaught SyntaxError: Unexpected token .
angular.js:13708 Error: [ng:areq] Argument 'MainCtrl' is not a function, got undefined
http://errors.angularjs.org/1.5.7/ng/areq?p0=MainCtrl&p1=not%20aNaNunction%2C%20got%20undefined
    at http://localhost:9000/bower_components/angular/angular.js:68:12
    at assertArg (http://localhost:9000/bower_components/angular/angular.js:1885:11)
    at assertArgFn (http://localhost:9000/bower_components/angular/angular.js:1895:3)
    at $controller (http://localhost:9000/bower_components/angular/angular.js:10210:9)
    at Object.<anonymous> (http://localhost:9000/bower_components/angular-ui-router/release/angular-ui-router.js:4095:28)
    at http://localhost:9000/bower_components/angular/angular.js:1240:18
    at invokeLinkFn (http://localhost:9000/bower_components/angular/angular.js:9814:9)
    at nodeLinkFn (http://localhost:9000/bower_components/angular/angular.js:9215:11)
    at compositeLinkFn (http://localhost:9000/bower_components/angular/angular.js:8510:13)
    at publicLinkFn (http://localhost:9000/bower_components/angular/angular.js:8390:30)

我不知道为什么它不起作用,而且“谷歌未定义错误”只是不合适的地方,因为当我只显示一个没有 .factory 的标记时,地图显示得很好。

【问题讨论】:

  • 你能设置一个 jsfiddle 链接,以便我可以帮助调试吗?
  • 您没有在控制器方法中使用 $scope。像这样使用 .controller('MainCtrl', function ($scope) { // });
  • @DurgpalSingh 有范围 .controller('MainCtrl', function ($scope,Markers)

标签: javascript angularjs google-maps google-maps-api-3 google-maps-markers


【解决方案1】:
return Markers;
    });

    .controller('MainCtrl', function ($scope,Markers) {
      $scope.map = { 

先把.controller前面的分号去掉。这导致您的控制器未配置。

【讨论】:

  • 感谢您的敏锐眼睛。这就是问题所在。除了google没有定义输出markerwithlabel.js:71 Uncaught ReferenceError: google is not defined infobox.js:116 Uncaught ReferenceError: google is not defined keydragzoom.js:820 Uncaught ReferenceError: google is not defined richmarker.js:60 Uncaught ReferenceError: google is not defined
  • 你导入了这些库吗?喜欢&lt;script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"&gt;&lt;/script&gt;?
  • 我在使用 bower &lt;script src="bower_components/markerclustererplus/src/markerclusterer.js"&gt;&lt;/script&gt; &lt;script src="bower_components/google-maps-utility-library-v3-markerwithlabel/dist/markerwithlabel.js"&gt;&lt;/script&gt; 安装时添加了这个
  • 它实际上说 google 没有定义,这意味着要么你没有添加 google api 本身,要么你把它放在实用程序之后。
猜你喜欢
  • 1970-01-01
  • 2017-10-09
  • 2016-05-09
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-09-16
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多