2016-04-22 120 views
0

你能幫我嗎?我嘗試使用AngularJS呈現頁面。頁面已被渲染,但在瀏覽器的控制檯中,它給我錯誤。錯誤的角度路由

app.js(主角度文件)

var DevApp = angular.module("DevApp", [ 'ngRoute' ]) 

.config(['$routeProvider',function($routeProvider) { 
    $routeProvider.when('/', { templateUrl: 'tpl/index.html', controller: "MainCtrl" }) 
    .otherwise({ 
      url: '/', 
      controller: "MainCtrl", 
      templateUrl: "tpl/index.html" 
     }); 
}]) 

.controller('MainCtrl', [ 
    '$scope', 
    '$http', 
    '$routeParams', 
    '$element', 
    '$timeout', 
    function($scope, $http, $routeParams, $element, $timeout) { 
     console.log(1); 
    } 
]); 

TPL/index.html中(MainCtrl的temppate)

<div ng-controller="MainCtrl"> 
    Главная страница 
</div> 

的index.html(主文件)

<!DOCTYPE html> 
<html ng-app="DevApp"> 
    <head> 
    <link rel="stylesheet" href="/bootstrap/dist/css/bootstrap.min.css"> 
    <script type="text/javascript" src="/javascripts/jquery/jquery.min.js"></script> 
    <script type="text/javascript" src="/javascripts/angular/angular.min.js"></script> 
    <script type="text/javascript" src="/javascripts/angular/angular-route.js"></script> 
    <script type="text/javascript" src="/javascripts/angular/app.js"></script> 
    <script type="text/javascript" src="/bootstrap/dist/js/bootstrap.min.js"></script> 
    </head> 
    <body> 
    <div ng-view></div> 
    </body> 
</html> 

我收到錯誤:

angular.js:12416 
Error: [$injector:unpr] http://errors.angularjs.org/1.4.5/$injector/unpr?p0=%24elementProvider%20%3C-%20%24element%20%3C-%20MainCtrl 
    at Error (native) 
    at http://127.0.0.1:3000/javascripts/angular/angular.min.js:6:416 
    at http://127.0.0.1:3000/javascripts/angular/angular.min.js:40:307 
    at Object.d [as get] (http://127.0.0.1:3000/javascripts/angular/angular.min.js:38:308) 
    at http://127.0.0.1:3000/javascripts/angular/angular.min.js:40:381 
    at d (http://127.0.0.1:3000/javascripts/angular/angular.min.js:38:308) 
    at e (http://127.0.0.1:3000/javascripts/angular/angular.min.js:39:64) 
    at Object.instantiate (http://127.0.0.1:3000/javascripts/angular/angular.min.js:39:213) 
    at http://127.0.0.1:3000/javascripts/angular/angular.min.js:80:257 
    at link (http://127.0.0.1:3000/javascripts/angular/angular-route.js:977:26) <div ng-view="" class="ng-scope"> 
+2

控制器參數中'$ element'和'$ timeout'是什麼意思? – niyasc

+0

我通過例子編寫了這段代碼。 現在我刪除$元素和$時間,它的工作原理! 但我不明白爲什麼代碼不起作用。 –

+1

您正在向控制器注入$ element服務。所以,當你想使用$元素時,你需要這個服務應該在控制器加載時可用。 –

回答

-1

我沒有測試你的代碼,但也許有路由器聲明錯字(沒有「url」參數)

.config(['$routeProvider',function($routeProvider) { 
    $routeProvider. 
    when('/', { templateUrl: 'tpl/index.html', controller: "MainCtrl" }) 
    otherwise({ 
      redirectTo: '/' 
     }); 
}]) 
0

試試這個

var DevApp = angular.module("DevApp", [ 'ngRoute' ]) 

DevApp.config(['$routeProvider',function($routeProvider) { 
    $routeProvider.when('/', { templateUrl: 'tpl/index.html', controller: "MainCtrl" }) 
    .otherwise({ 
      url: '/', 
      controller: "MainCtrl", 
      templateUrl: "tpl/index.html" 
     }); 
}]) 

DevApp.controller('MainCtrl', [ 
    '$scope', 
    '$http', 
    '$routeParams', 
    '$element', 
    '$timeout', 
    function($scope, $http, $routeParams, $element, $timeout) { 
     console.log(1); 
    } 
]); 
1

Unknown provider: $elementProvider <- $element <- MainCtrl,這意味着$element無法注入您的MainCtrl

+0

你跑得比我快,回覆:D –