如何修复Angular JS错误:[$ injector:modulerr]

时间:2017-02-01 07:47:38

标签: javascript angularjs

我遇到了Angular JS收到错误的问题

jquery.js:7993 Uncaught Error: [$injector:modulerr] Failed to instantiate module siteApplication due to:
Error: [$injector:nomod] Module 'siteApplication' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.5.9/$injector/nomod?p0=siteApplication
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:68:12)
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:2127:17)
    at ensure (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:2051:38)
    at module (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:2125:14)
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4660:22)
    at forEach (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:325:20)
    at loadModules (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4644:5)
    at createInjector (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4566:19)
    at doBootstrap (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:1803:20)
    at bootstrap (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:1824:12)
http://errors.angularjs.org/1.5.9/$injector/modulerr?p0=siteApplication&p1=…%2Fjquery%2F1.8.3%2Fjquery.js%3A564%3A22)%2C%20%3Canonymous%3E%3A1824%3A12)
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:68:12)
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:2127:17)
    at ensure (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:2051:38)
    at module (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:2125:14)
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4660:22)
    at forEach (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:325:20)
    at loadModules (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4644:5)
    at createInjector (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4566:19)
    at doBootstrap (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:1803:20)
    at bootstrap (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:1824:12)
http://errors.angularjs.org/1.5.9/$injector/modulerr?p0=siteApplication&p1=…%2Fjquery%2F1.8.3%2Fjquery.js%3A564%3A22)%2C%20%3Canonymous%3E%3A1824%3A12)
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:68:12)
    at eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4683:15)
    at forEach (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:325:20)
    at loadModules (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4644:5)
    at createInjector (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:4566:19)
    at doBootstrap (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:1803:20)
    at bootstrap (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:1824:12)
    at angularInit (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:1709:5)
    at HTMLDocument.eval (eval at <anonymous> (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:564:22), <anonymous>:32379:5)
    at fire (http://localhost/livesource/scripts/jquery/1.8.3/jquery.js:974:30) 

我的观点是 site.jsp ,如下所示

<%@page import="com.mfg.enums.rules.rule.Rule"%>
<%@page import="com.sourcingparts.rules.Rules"%>
<%@ page contentType="text/html; charset=utf-8"%>
<%@page import="java.util.Locale"%>
<%@page import="com.mfg.cache.IDictionnaryCache"%>
<%@page import="com.mfg.common.http.HttpCookies"%>
<%@page import="com.mfg.clientJsp.helper.SpringBeanHelper"%>

<%
   Locale langue = new Locale(HttpCookies.getLocale(request, response));
            IDictionnaryCache dictionary = SpringBeanHelper
                    .getDictionary(request);
%>
<script type="text/javascript">
    delete window.angular;
    var errorMessages = {
            required : '<%=dictionary.getToken(langue, "LS_FIELD_REQUIRED")%>'
        };
</script>
<jsp:include page="/livesource/quality/scripts/script.jsp">
    <jsp:param value="true" name="isAdminView" />
</jsp:include>
<link rel="stylesheet" type="text/css" href="/livesource/tooling/css/03_specialReset.css" />
<link href="/livesource/quality/css/site/qualSite.css" rel="stylesheet" type="text/css" />
<div data-ng-app="siteApplication" data-ng-controller="siteController" data-ng-cloak>
<% 
    if(Rules.hasRule(session,Rule.PARAM_B_MANAGE_COMPANY_PLANTS))
    {
%>
    <div style="clear: both;" id="contextMenuDiv">
        <ul id="subnav_rfq">
            <li><a href="javascript:void(0)" data-ng-click="createAndEdit()">
                    <%=dictionary.getToken( langue, "LS_CREATE_NEW_SITE" )%></a><span
                class="fontdivider">|</span></li>
            <li><a href="javascript:void(0)"
                style="{{chacks.length === 1 ? '' : 'color: silver !important; text-decoration: none !important;' }}"
                data-ng-click="editAll()"><%=dictionary.getToken( langue, "MFGSITE_EDIT" )%></a>
                </a><span class="fontdivider">|</span></li>
            <li><a href="javascript:void(0)"
                style="{{chacks.length >0 ? '' : 'color: silver !important; text-decoration: none !important;' }}"
                data-ng-click="deleteAll()"><%=dictionary.getToken( langue, "DELETE" )%></a>
            </li>
        </ul>
    </div>
<%
    }
%>
<!--    <ng-include src="includeurl"></ng-include> -->
        <jsp:include page="/livesource/quality/admin/site/include/list.jsp"></jsp:include>
</div>

我的控制器是 siteController.js ,如下所示

angular.module('siteApplication') .controller( 'siteController', [ '$scope', 'siteService', '$uibModal', '$uibModalStack','$rootScope', function($scope, siteService, $uibModal, $uibModalStack,$rootScope) {
    $uibModalStack.dismissAll("dismiss-all");
    $scope.chacks = [];
    $scope.showListSpinner = false;
    var defaultHeaders = {
        siteLabel : 'default',
        addressString : 'default',
        countryName : 'default',
    };
    $scope.headers = {};

    $scope.errorMessages = errorMessages;

    $scope.order = {};
    $scope.order.filterString;
    $scope.order.orderByField;
    $scope.order.reverseSort = false;
    $scope.order.pageLimit = 10;
    $scope.order.currentPage = 0;

    $scope.order.setPageLimit = function(pageLimit){
        $scope.order.currentPage = 0;
        $scope.order.pageLimit = pageLimit;
    };
    var resetHeaders = function() {
        $scope.reverseSort = false;
        $scope.headers = angular.copy(defaultHeaders);
    }
    $scope.sort = function(menu){
        if($scope.headers[menu] === 'default'){
            $scope.headers[menu] = "increasing";
            $scope.order.reverseSort = false;
        }else if($scope.headers[menu] === 'increasing'){
            $scope.headers[menu] = "decreasing";
            $scope.order.reverseSort = true;
        }else{
            $scope.headers[menu] = "increasing";
            $scope.order.reverseSort = false;
        }
        $scope.order.orderByField = menu;
        var menuVal = $scope.headers[menu];
        resetHeaders();
        $scope.headers[menu] = menuVal;
    }


    var init = function() {
        resetHeaders();
        $scope.showListSpinner = true;
        siteService.getSiteList(function(response) {
            $scope.sites = response.data;
            $scope.showListSpinner = false;
            $scope.chacks.splice(0,$scope.chacks.length)
        });
    };
    init();
    $rootScope.$on("refresh-site-list",function(){
        init();
    });
    var removeByProperty = function(property) {
        $scope.sites = $scope.sites.filter(function(value) {
                                            return !value[property];
                                        })
    }

我的服务是 siteservice.js ,如下所示

angular.module('siteApplication').service('siteService',
        [ '$resource', function($resource) {
            var requstService = $resource('quality', {}, {
                getSiteList : {
                    url : "/qualityAdminSite/getSiteList.do",
                    method : "GET"
                },
                deleteSite : {
                    url : "/qualityAdminSite/deleteSite.do",
                    method : "POST"
                },
                saveSite : {
                    url : "/qualityAdminSite/saveSite.do",
                    method : "POST"
                },
                getCountries : {
                    url : "/qualityAdminSite/getCountries.do",
                    method : "GET"
                },
                getRegions : {
                    url : "/qualityAdminSite/getRegions.do",
                    method : "POST"
                }
            });
            return requstService;
        } ]);

当我加载视图页面时,它运行得很完美,但是当我再次单击站点链接时,它显示上面的错误。请帮助。

3 个答案:

答案 0 :(得分:2)

你的控制器应该是,

angular.module('siteApplication',[]) .controller( 'siteController', [ '$scope', 'siteService', '$uibModal', '$uibModalStack','$rootScope', function($scope, siteService, $uibModal, $uibModalStack,$rootScope) {

答案 1 :(得分:0)

在控制器中使用[]来创建这样的模块。

angular.module('moduleName', [])

并在您的html页面中使用此内容,例如ng-app="moduleName"

并添加与$uibModal相关的依赖项js文件。

答案 2 :(得分:0)

您的模块丢失[] 你的控制器应该是:

angular.module('siteApplication',[])

你也没有粘贴控制器的结尾部分,即} ]); 故意?