AngularJs 与谷歌地图答案

【问题标题】：AngularJs with Google MapsAngularJs 与谷歌地图
【发布时间】：2015-06-18 18:07:21
【问题描述】：

我有这个代码是因为我想在我的 web 应用程序中加入谷歌地图，但它不起作用。这是页面html：

<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script src="js/libs/angular.js/angular.js"></script>
        <script src="js/libs/angular.js/angular-route.js"></script>

        <script src="http://maps.google.cn/maps/api/js?sensor=false"></script>
        <script src="js/libs/mappa/lodash.js"></script>
        <script src="js/libs/mappa/angular-google-maps.min.js"></script>

    </head>
    <body>

         <div>
              <ui-gmap-google-map center=map.center zoom=map.zoom style="width: 400px; height: 400px;"></ui-gmap-google-map>                    
        </div>

    </body>
</html>

这是我在 AngularJs 中的控制器：

var modulo = angular.module('progetto', ['ngRoute', 'uiGmapgoogle-maps']);

modulo.controller('descriptionController', function ($scope, $routeParams, $http) {
     $scope.map = { center: { latitude: 45, longitude: -73 }, zoom: 8 };

    }).
        error(function (data, status) {
            $scope.listaEventi = "Request failed";
        });

错误在哪里？我认为我导入了确切的库！

【问题讨论】：

请包含错误
另外，如果这就是你所有的 JS 代码......你对 .error 的调用是在控制器本身上......
它不显示错误！反正这是一段代码！

标签： javascript angularjs html google-maps google-maps-api-3

【解决方案1】：

你似乎忘记了你的

<div ng-controller="descriptionController">

您需要将库传递给控制器

.controller("descriptionController", function($scope, uiGmapGoogleMapApi)

【讨论】：

我使用 ng-controller="descriptionController" 但我在副本中省略了它 XD

【解决方案2】：

您的 html 属性周围缺少引号...
你缺少 ng-app
您缺少 ng-controller
您在控制器上调用 .error (?)

你需要定义这个css规则：

.angular-google-map-container { height: 400px; }

指令中的内联样式不够。

下次请检查您的js错误控制台。您所说的“没有错误”很可能是不正确的。

这是一个有效的小提琴...http://jsfiddle.net/ybtn4kn2/

【讨论】：

我找到了解决方案...首先这是一段代码，反正我没有定义 css 规则...否则一切正常！
好的...如果您希望我们能够有效地帮助您，下次您应该逐字发布您的代码。如果对您有帮助，请将此答案标记为正确。