Question

这是我的HTML：

<!DOCTYPE html>
<html ng-app="mainApp">
<head>
    <title></title>
    <link href="/Content/ui-grid.css" rel="stylesheet"/>
</head>
<body ng-controller="MainController">
    <h2>Welcome to ASP.NET MVC 5.2 on Mono!</h2>
    <script src="/Scripts/angular-mocks.js"></script>
    <script src="/Scripts/angular-resource.js"></script>
    <script src="/Scripts/angular-route.js"></script>
    <script src="/Scripts/angular.js"></script>
    <script src="/Scripts/ui-grid.js"></script>
    <script src="/App/Controllers/MainController.js"></script>
    <script src="/App/App.js"></script>
</body>
</html>

我检查了资源标签，确认所有JS文件都可用。

这是我的App.js：

'use strict';

(function () {
    angular
    .module('mainApp', ['ngResource', 'ngRoute'])
    .config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
        $locationProvider.html5Mode(true);
        debugger;
        $routeProvider
        .when('/events',
        {
            templateUrl: 'App/Templates/Main.html',
            controller: 'MainController'
        })
        .otherwise({redirectTo: 'events'});
    }]);
})();

这是MainController.js：

'use strict';

(function () {
    angular
    .module('mainApp')
    .controller('MainController', ['$scope', '$location', function($scope, $location) {
        $scope.goHome = function() {
            $location.replace();
            $location.url('/');
        };
        $scope.createEvent = function() {
            $location.replace();
            $location.url('/newEvent');
        };
        $scope.listAllEvents = function() {
            $location.replace();
            $location.url('/events');
        };
    }]);
})();

我目前在浏览器控制台中收到以下错误：

TypeError: undefined is not an object (evaluating 'angular.mock = {}')

TypeError: undefined is not an object (evaluating 'angular.$$minErr')
(anonymous function) — angular-resource.js:8
Global Code — angular-resource.js:847

TypeError: undefined is not an object (evaluating 'angular.
  module')

Error: [$injector:nomod] Module 'mainApp' 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.6.1/$injector/nomod?p0=mainApp

Error: [$injector:modulerr] Failed to instantiate module mainApp due to:
[$injector:modulerr] Failed to instantiate module ngResource due to:
[$injector:nomod] Module 'ngResource' 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.

我应该如何解决错误并加载mainApp？

Answer 1

我认为问题在于你在html中包含文件的顺序。您的角度应该在任何其他脚本文件之前，因为它们依赖于角度

尝试以下序列

<script src="/Scripts/angular.js"></script>
<script src="/Scripts/angular-mocks.js"></script>
<script src="/Scripts/angular-resource.js"></script>
<script src="/Scripts/angular-route.js"></script>
<script src="/Scripts/ui-grid.js"></script>
<script src="/App/App.js"></script>
<script src="/App/Controllers/MainController.js"></script>

模块'mainApp'不可用

1 个答案: