2016-06-20 79 views
0

我正在尝试设置角路由器。我是this教程。

我已经安装了使用凉亭的角度和角度路由器,并将它们列在我的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)

我在做什么错?

+0

你应该改变为'angular.js'而不是'angular.min.js'解决这个问题,因为缩小的版本没有按”给出明确的错误信息。另外,通过在'ng-app'所在的元素中添加'ng-strict-di',您可以发现依赖注入错误。 – Claies

+0

更新的主要问题与错误日志 –

回答

2

其错字

$locationProvider.hasPrefix('!'); 

应该

$locationProvider.hashPrefix('!'); 
+0

谢谢,错误消失:P –

相关问题