AngularJS 1.2.9 ngRoute "unknown provider $routeProvide

AngularJS 1.2.9 ngRoute "unknown provider $routeProvider error with requireJS

本文关键字：unknown provider routeProvide quot ngRoute AngularJS      更新时间：2023-09-26

我使用angularJS-1.2.9和angular-route-1.2.9来为我的应用程序设置路由，我使用requireJS作为依赖加载器并模块化代码。我已经添加了ngRoute依赖到AngularJS配置，但仍然得到以下错误在chrome控制台Uncaught错误:[$injector:modulerr]未能实例化模块myApp由于:错误:[$injector:unpr]未知提供商:$routeProvoider

我的代码

main.js 

 require.config({
    baseUrl: './js',
    paths: {
        angular: 'libs/angular-1.2.9',
        angularRoute: 'libs/angular-route-1.2.9'
    },
    shim: {
        'angularRoute': {
            deps: ['angular'],
            exports: 'angularRoute'
        },
        'angular': {
            exports: 'angular'
        }
    }
});
require(['angular', 'angularRoute'], function (angular, angularRoute) {
    'use strict';
    var app = angular.module('myApp', ['ngRoute']);
    angular.element(document).ready(function () {
        angular.bootstrap(document, ['myApp']);
    });
    app.controller('indexController', function ($scope, $http) {
        console.log('inside index');
    });
    app.config(
        function ($routeProvoider) {
            $routeProvider.
            when('/', {
                templateUrl: 'index_content.html',
                controller: 'indexController'
            })
        });
});

这是我的html文件

index . html 

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
        <meta charset="utf-8">
        <script data-main="js/main.js" src="js/libs/require.js"></script>
    </head>
    <body>
        <div ng-view>
        </div>
    </body>
</html>

index_content.html 

<p>inside Index content</p>
<h1>testing the ang routes

这里有什么问题?为什么它仍然给出上面提到的错误??如何解决这个问题?

我已经纠正了$routeProvider的代码，并将代码放在下面:

代码片段:

require(['angular', 'angularRoute'], function (angular, angularRoute) {
'use strict';
var app = angular.module('myApp', ['ngRoute']);
angular.element(document).ready(function () {
    angular.bootstrap(document, ['myApp']);
});
app.controller('indexController', function ($scope, $http) {
    console.log('inside index');
});
app.config(
    function ($routeProvider) { //One typo here
        $routeProvider.
        when('/', {
            templateUrl: 'index_content.html',
            controller: 'indexController'
        })
    });
});


app.config(
  function ($routeProvider) {
    $routeProvider.
    when('/ResourceItem/:RE_RestoId',{
      templateUrl:'./partials/state-view.html',
      controller: function ($routeParams, ResourceService) {
        this.params = $routeParams;
        var that =  this;
        ResourceService.getResourceItem(this.params.RE_RestoId || "").success(function (data) {
          that.items = data;
        })
        this.addItemTo = function (resource)
        {
          if(!resource.items)
          {
            resource.items = [];
          }
          resource.items.push({TA_Code: this.newResourceItem });
          this.newResourceItem="";
        };
      },
      controllerAs:'ResourceItemCtrl'

    });
});
相关文章：