为什么我的angularJS路由不工作,chrome'error [$injector:unpr]未知的提供商

why my angularJS route doesn't work, chrome'error [$injector:unpr] Unknown provider

本文关键字:injector unpr 提供商 未知 error 路由 angularJS 我的 工作 chrome 为什么      更新时间:2023-09-26

我尝试使用angularJS的路由
但是它不起作用
我不知道为什么
app.js

(function() {
  var todoApp;
  todoApp = angular.module('todoApp', ['ngRoute']);
  todoApp.config([
  ┊ '$routeProvider', function($routeProvider) {
  ┊ ┊ $routeProvider.when('todo/day', {
  ┊ ┊ ┊ template: '<div class="box" ng-class="classname">Edit</div>',
  ┊ ┊ ┊ controller: function($scope) {
  ┊ ┊ ┊ ┊ $scope.classname = "edit";
  ┊ ┊ ┊ }
  ┊ ┊ }).otherwise({
  ┊ ┊ ┊ redirecTo: '/todo'
  ┊ ┊ });
  ┊ }
  ]);
  todoApp.controller('todoCtrl', function($scope) {
  ┊ return console.log(123);
  });
}).call(this);

这是我的应用程序中的HTML

. html

  ┊ <div class="five wide column" ng-app="todoApp" ng-controller="todoCtrl">
  ┊ ┊ <div class="ui segment">
  ┊ ┊ ┊ <div ng-view></div>
  ┊ ┊ </div>
  ┊ </div>

chrome的控制台在这里

Error: [$injector:unpr] Unknown provider: $templateRequestProvider <- $templateRequest <- $route <- ngViewDirective  
Error: [$injector:cdep] Circular dependency found: ngViewDirective

首先,确保你在index.html中包含了angular-route.js,如果你还没有这样做的话。你的脚本中有一些错误,如果可以的话,试试这个。

(function() {
var todoApp = angular.module('todoApp', ['ngRoute']);
    todoApp.config(['$routeProvider',
        function($routeProvider) {
            $routeProvider.
            when('todo/day', {
                template: '<div class="box" ng-class="classname">Edit</div>',
                controller: function($scope) {
                    $scope.classname = "edit";
                }
            }).otherwise({
                redirectTo: '/todo'
            });
        }
    ]);
    todoApp.controller('todoCtrl', function($scope) {
        return console.log(123);
    });
}).call(this);

似乎你必须包含angular-route.js,并确保你用ngRoute初始化了你的应用模块。

在你的html中输入:

<script src="bower_components/angular-route/angular-route.js"></script>

初始化你的应用:

var myApp = angular.module('myApplication', ['ngRoute']);

确保你的Routeprovider工作正常,我总是这样写:

myApp.config(function ($routeProvider) {
      $routeProvider
             .when('/', {
                   templateUrl: 'views/mainPages/main.html',
                   controller: 'MainController'
             })
             .when('/news', {
                   templateUrl: 'views/mainPages/news.html',
                   controller: 'NewsController'
             })
             .otherwise({
                   redirectTo: '/'
             });
        })

希望对你有帮助。

尝试使用server运行它。这对我来说很有效。

与eclipse一起运行file>new>Dynamic web project>finish copy your project files to the web content folder run it