google angular 模块不工作
google angular module don't work
我将其添加到我的项目中:https://angular-ui.github.io/angular-google-maps/#!/
我按照建议将此文件添加到我的 BundleConfig 中的 proyect mvc(由 Nuget 下载):
bundles.Add(new ScriptBundle("~/bundles/map").Include(
"~/Scripts/lodash.min.js",
"~/Scripts/angular-google-maps-street-view.min.js",
"~/Scripts/angular-google-maps.min.js"));
在app.js中有这个:
(function () {
"use strict";
angular
.module('app', ['ngRoute', 'ngAnimate', 'ui.bootstrap', 'uiGmapgoogle-maps']).config(configRoute);
configRoute.$inject = ['$routeProvider', '$locationProvider'];
function configRoute($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'scripts/app/partials/Home.html',
controller: 'productosPrincipalCtrl',
controllerAs: 'vm'
})
.when('/mapa', {
templateUrl: 'scripts/app/partials/mapa.html'
})
.when('/ofertas/:type', {
templateUrl: 'scripts/app/partials/productos.html',
controller: 'listProductsCtrl',
controllerAs: 'vm'
})
.when('/oferta-detalle/:type', {
templateUrl: 'scripts/app/partials/producto-detalle.html',
controller: 'productDetailCtrl',
controllerAs: 'vm'
})
.otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(false);
}
})();
在布局中我加载脚本:
<!DOCTYPE html>
<html data-ng-app="app">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - Ofertas al Toque</title>
@Styles.Render("~/Content/css")
@*@Scripts.Render("~/bundles/modernizr")*@
<script src='//maps.googleapis.com/maps/api/js'></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#/home" class="navbar-brand">MyPagina</a>
.
.
.
.
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
@Scripts.Render("~/bundles/angular")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/map")
@RenderSection("scripts", required: false)
</body>
</html>
当 运行 应用程序抛出错误并且页面中没有加载任何内容时,如果我擦除 'uiGmapgoogle-maps' 一切正常,但我需要地图。
注意:我在主页上没有使用地图,但我也有错误
抛出的错误 angular 是这样的:https://docs.angularjs.org/error/$injector/modulerr?p0=app&p1=Error:%20%5B$injector:modulerr%5D%20http:%2F% 2Ferrors.angularjs.org%2F1.4.8%2F$injector%2Fmodulerr%3Fp0%3DuiGmapgoogle-maps
如果有人可以帮助我。
提前致谢!
我需要添加这个脚本,以免抛出更多错误:
https://github.com/nmccready/angular-simple-logger
注意:Nuget 不会自动下载。
我将其添加到我的项目中:https://angular-ui.github.io/angular-google-maps/#!/
我按照建议将此文件添加到我的 BundleConfig 中的 proyect mvc(由 Nuget 下载):
bundles.Add(new ScriptBundle("~/bundles/map").Include(
"~/Scripts/lodash.min.js",
"~/Scripts/angular-google-maps-street-view.min.js",
"~/Scripts/angular-google-maps.min.js"));
在app.js中有这个:
(function () {
"use strict";
angular
.module('app', ['ngRoute', 'ngAnimate', 'ui.bootstrap', 'uiGmapgoogle-maps']).config(configRoute);
configRoute.$inject = ['$routeProvider', '$locationProvider'];
function configRoute($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: 'scripts/app/partials/Home.html',
controller: 'productosPrincipalCtrl',
controllerAs: 'vm'
})
.when('/mapa', {
templateUrl: 'scripts/app/partials/mapa.html'
})
.when('/ofertas/:type', {
templateUrl: 'scripts/app/partials/productos.html',
controller: 'listProductsCtrl',
controllerAs: 'vm'
})
.when('/oferta-detalle/:type', {
templateUrl: 'scripts/app/partials/producto-detalle.html',
controller: 'productDetailCtrl',
controllerAs: 'vm'
})
.otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(false);
}
})();
在布局中我加载脚本:
<!DOCTYPE html>
<html data-ng-app="app">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - Ofertas al Toque</title>
@Styles.Render("~/Content/css")
@*@Scripts.Render("~/bundles/modernizr")*@
<script src='//maps.googleapis.com/maps/api/js'></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#/home" class="navbar-brand">MyPagina</a>
.
.
.
.
</div>
</div>
</div>
<div class="container body-content">
@RenderBody()
<hr />
<footer>
<p>© @DateTime.Now.Year - My ASP.NET Application</p>
</footer>
</div>
@Scripts.Render("~/bundles/angular")
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/map")
@RenderSection("scripts", required: false)
</body>
</html>
当 运行 应用程序抛出错误并且页面中没有加载任何内容时,如果我擦除 'uiGmapgoogle-maps' 一切正常,但我需要地图。
注意:我在主页上没有使用地图,但我也有错误
抛出的错误 angular 是这样的:https://docs.angularjs.org/error/$injector/modulerr?p0=app&p1=Error:%20%5B$injector:modulerr%5D%20http:%2F% 2Ferrors.angularjs.org%2F1.4.8%2F$injector%2Fmodulerr%3Fp0%3DuiGmapgoogle-maps
如果有人可以帮助我。
提前致谢!
我需要添加这个脚本,以免抛出更多错误:
https://github.com/nmccready/angular-simple-logger
注意:Nuget 不会自动下载。