Question

我尝试使用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

Answer 1

首先，如果您还没有这样做，请确保在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);

Answer 2

您似乎必须包含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: '/'
             });
        })

我希望你能发现它有用。

Answer 3

尝试使用server运行它。它对我有用。

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

为什么我的angularJS路线不起作用，chrome'error [$ injector：unpr]未知提供商

3 个答案: