從1.3.x降級到AngularJS 1.2.28錯誤：$ injector：modulerr

Question

我不得不將AngularJS從1.3降級到1.2.28以便我可以支持IE8（我的客戶決定他們在我們開始后需要支持它）。 我采取的第一步是將所有對AngularJS的引用更改為1.2.28：

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-route.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-resource.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-sanitize.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-loader.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-cookies.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-animate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-touch.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

這是我的app.module.js中的設置：

(function () {
    'use strict';

    angular
        .module('mn', [
            'ngRoute',
            'angularSpinner',
            'angular-cache',
            'ngSanitize',
            'ui.bootstrap',
            'mn.catalog',
            'mn.common',            
        ])
    .run(CacheSetup);

    CacheSetup.$inject = ['CacheFactory'];

    /** @ngInject */
    function CacheSetup(CacheFactory) {
        CacheFactory.createCache('profileCache', {
            maxAge: 30 * 60 * 1000, //30 min
            deleteOnExpire: 'aggressive',
            storageMode: 'sessionStorage',
            storagePrefix: 'si-cache.caches.'
        });

        CacheFactory.createCache('ransCache', {
            maxAge: 30 * 60 * 1000, //30 min
            deleteOnExpire: 'aggressive',
            storageMode: 'sessionStorage',
            storagePrefix: 'si-cache.caches.'
        });
    }
})();

這是我的app.routes.js文件：

(function () {
    'use strict';

    angular
        .module('mn')
        .config(config);

    config.$inject = ['$routeProvider'];

    /** @ngInject */
    function config($routeProvider) {
        $routeProvider.
            when("/AccountSettings", {
                templateUrl: "/angularRoot/modules/accountSettings/login.html",
                controller: 'AccountSettingsController as vm',
                caseInsensitiveMatch: true
            })
            .otherwise({
                redirectTo: '/welcome'
            });
    }
})();

這是我的index.html

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />

    <title>Page Title</title>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-route.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-resource.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-sanitize.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-loader.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-cookies.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-animate.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular-touch.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

    <script src="angularRoot/externalReference/spin.min.js"></script>
    <script src="angularRoot/externalReference/vendor/jquery.main.js"></script>
    <script src="angularRoot/externalReference/d3.min.js"></script>
    <script src="angularRoot/externalReference/linq.min.js"></script>
    <script src="angularRoot/externalReference/respond.min.js"></script>

    <script src="angularRoot/core/app.module.js"></script>
    <script src="angularRoot/core/app.routes.js"></script>

    <script src="angularRoot/modules/accountActivity/accountActivity.module.js"></script>
    <script  src="angularRoot/modules/accountActivity/accountActivity.controller.js">   </script>

    <link href="css/3rdParty/bootstrap.css" rel="stylesheet" />
    <link href="css/vendorStyles.css" rel="stylesheet" />
    <link href="css/Styles.css" rel="stylesheet" />

</head>

<body ng-app='mn' ng-strict-di>

    <div id="wrapper" ng-view>
    </div>

    <!--[if lt IE 7]>
         <p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to    improve your experience.</p>
    <![endif]-->

</body>
</html>

我在Google Chrome中收到此錯誤，頁面完全空白：

Failed to instantiate module mn due to:
Error: [$injector:modulerr]       http://errors.angularjs.org/1.2.28/$injector/modulerr?p0=...)
at Error (native)
at https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:6:450
at https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:34:97
at r (https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:7:290)
at e (https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:33:207)
at https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:33:284
at r (https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:7:290)
at e (https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:33:207)
at ec (https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:36:309)
at c (https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.28/angular.min.js:18:170

Answer 1

好像你錯過了加載ui.bootstrap相關文件，你只加載了bootstrap.js

當你使用Angular 1.X時，你需要使用0.12.0是這個支持AngularJS 1.2.x的庫的最后一個版本。

訪問Angular ui bootstrap並查找Getting Started Module。

Answer 2

請不要使用此指令'ng-strict-di'。 它以角1.3引入。這里是附件鏈接供參考

http://bartwullems.blogspot.in/2014/10/angularjs-13-ng-strict-di-directive.html

Answer 3

根據@Pavel Horal的建議，我切換到非最小化角度並得到了完整的錯誤，它實際上顯示我缺少一些模塊，其中一個是Angular UI Bootstrap，如pankajparkar所述。

還有其他降級問題我正在努力解決，但轉換到非最小化版本確實幫助找到了所有這些問題。

從1.3.x降級到AngularJS 1.2.28錯誤：$ injector：modulerr

問題描述

3 個解決方案

解決方案1
1 2015-06-22 19:22:25

解決方案2
0 2015-06-22 19:03:35

解決方案3
0 2015-06-23 19:10:47

從1.3.x降級到AngularJS 1.2.28錯誤：$ injector：modulerr

問題描述

3 個解決方案

解決方案1 1 2015-06-22 19:22:25

解決方案2 0 2015-06-22 19:03:35

解決方案3 0 2015-06-23 19:10:47

解決方案1
1 2015-06-22 19:22:25

解決方案2
0 2015-06-22 19:03:35

解決方案3
0 2015-06-23 19:10:47