角度布线错误

Error in Angular routing

本文关键字：错误 布线      更新时间：2023-09-26

你能帮我吗？我尝试使用AngularJS渲染页面。页面已呈现，但在浏览器控制台中它给了我错误。

应用程序.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 的临时）

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

索引.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">

Unknown provider: $elementProvider <- $element <- MainCtrl ，这意味着无法将$element注入您的MainCtrl中。

试试这个

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);
    }
]);
我没有

测试你的代码，但路由器声明中可能有拼写错误（没有"url"参数） 

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