angular1 - 未捕获的错误 $injector:modulerr; angular-路由器
angular1 - Uncaught Error $injector:modulerr; angular-router
我正在尝试设置 angular 路由器。
我正在学习 this 教程。
我已经使用 bower 安装了 angular 和 angular-router,并将它们列在我的 html 中。一切似乎都按预期加载(控制台中没有 404 错误),所以脚本就在那里:
<html>
<head>
<title>Miha Šušteršič</title>
<!-- JQUERY -->
<script src="assets/vendor/jquery/dist/jquery.min.js"></script>
<!-- FOUNDATION -->
<script src="assets/vendor/foundation-sites/dist/foundation.min.js"></script>
<!-- ANGULAR -->
<script src="assets/vendor/angular/angular.min.js"></script>
<script src="assets/vendor/angular-route/angular-route.min.js"></script>
<!-- APP -->
<script src="assets/js/app.min.js" type="text/javascript"></script>
<!-- FOUNDATION -->
<link rel="stylesheet" href="assets/vendor/foundation-sites/dist/foundation.min.css">
<!-- APP -->
<link rel="stylesheet" href="assets/css/main.css">
</head>
<body ng-app="IntroductionApp">
<!-- ANGULAR APP -->
<portfolio></portfolio>
<!-- FOUNDATION -->
<script>
$(document).foundation();
</script>
</body>
</html>
现在我正在尝试设置一些基本路由。这是我的 app.js 文件(编译成 angular.min.js):
// MAIN ANGULAR JS FILE
angular
.module('IntroductionApp', ['ngRoute'])
.config(['$locationProvider', '$routeProvider',
function config($locationProvider, $routeProvider) {
$locationProvider.hasPrefix('!');
$routeProvider.
when('/landing', {
templateUrl: 'templates/landing.html'
}).
when('/portfolio', {
templateUrl: 'templates/portfolio.html'
}).
otherwise('/landing');
}
]);
现在我在控制台中收到以下错误:
angular.js:68 Uncaught Error: [$injector:modulerr] Failed to
instantiate module IntroductionApp due to: TypeError: t.hasPrefix is
not a function
at http://localhost:48080/assets/js/app.min.js:1:108
at Object.invoke (http://localhost:48080/assets/vendor/angular/angular.js:4709:19)
at runInvokeQueue (http://localhost:48080/assets/vendor/angular/angular.js:4602:35)
at http://localhost:48080/assets/vendor/angular/angular.js:4611:11
at forEach (http://localhost:48080/assets/vendor/angular/angular.js:321:20)
at loadModules (http://localhost:48080/assets/vendor/angular/angular.js:4592:5)
at createInjector (http://localhost:48080/assets/vendor/angular/angular.js:4514:19)
at doBootstrap (http://localhost:48080/assets/vendor/angular/angular.js:1751:20)
at bootstrap (http://localhost:48080/assets/vendor/angular/angular.js:1772:12)
at angularInit (http://localhost:48080/assets/vendor/angular/angular.js:1657:5)
http://errors.angularjs.org/1.5.7/$injector/modulerr?p0=IntroductionApp&p1=…2F%2Flocalhost%3A48080%2Fassets%2Fvendor%2Fangular%2Fangular.js%3A1657%3A5)
我做错了什么?
错别字
$locationProvider.hasPrefix('!');
应该是
$locationProvider.hashPrefix('!');
我正在尝试设置 angular 路由器。
我正在学习 this 教程。
我已经使用 bower 安装了 angular 和 angular-router,并将它们列在我的 html 中。一切似乎都按预期加载(控制台中没有 404 错误),所以脚本就在那里:
<html>
<head>
<title>Miha Šušteršič</title>
<!-- JQUERY -->
<script src="assets/vendor/jquery/dist/jquery.min.js"></script>
<!-- FOUNDATION -->
<script src="assets/vendor/foundation-sites/dist/foundation.min.js"></script>
<!-- ANGULAR -->
<script src="assets/vendor/angular/angular.min.js"></script>
<script src="assets/vendor/angular-route/angular-route.min.js"></script>
<!-- APP -->
<script src="assets/js/app.min.js" type="text/javascript"></script>
<!-- FOUNDATION -->
<link rel="stylesheet" href="assets/vendor/foundation-sites/dist/foundation.min.css">
<!-- APP -->
<link rel="stylesheet" href="assets/css/main.css">
</head>
<body ng-app="IntroductionApp">
<!-- ANGULAR APP -->
<portfolio></portfolio>
<!-- FOUNDATION -->
<script>
$(document).foundation();
</script>
</body>
</html>
现在我正在尝试设置一些基本路由。这是我的 app.js 文件(编译成 angular.min.js):
// MAIN ANGULAR JS FILE
angular
.module('IntroductionApp', ['ngRoute'])
.config(['$locationProvider', '$routeProvider',
function config($locationProvider, $routeProvider) {
$locationProvider.hasPrefix('!');
$routeProvider.
when('/landing', {
templateUrl: 'templates/landing.html'
}).
when('/portfolio', {
templateUrl: 'templates/portfolio.html'
}).
otherwise('/landing');
}
]);
现在我在控制台中收到以下错误:
angular.js:68 Uncaught Error: [$injector:modulerr] Failed to instantiate module IntroductionApp due to: TypeError: t.hasPrefix is not a function at http://localhost:48080/assets/js/app.min.js:1:108 at Object.invoke (http://localhost:48080/assets/vendor/angular/angular.js:4709:19) at runInvokeQueue (http://localhost:48080/assets/vendor/angular/angular.js:4602:35) at http://localhost:48080/assets/vendor/angular/angular.js:4611:11 at forEach (http://localhost:48080/assets/vendor/angular/angular.js:321:20) at loadModules (http://localhost:48080/assets/vendor/angular/angular.js:4592:5) at createInjector (http://localhost:48080/assets/vendor/angular/angular.js:4514:19) at doBootstrap (http://localhost:48080/assets/vendor/angular/angular.js:1751:20) at bootstrap (http://localhost:48080/assets/vendor/angular/angular.js:1772:12) at angularInit (http://localhost:48080/assets/vendor/angular/angular.js:1657:5) http://errors.angularjs.org/1.5.7/$injector/modulerr?p0=IntroductionApp&p1=…2F%2Flocalhost%3A48080%2Fassets%2Fvendor%2Fangular%2Fangular.js%3A1657%3A5)
我做错了什么?
错别字
$locationProvider.hasPrefix('!');
应该是
$locationProvider.hashPrefix('!');