angular-route.min.js 的问题 |错误 Chrome 控制台 [$injector:modulerr]答案

【问题标题】：Issue with angular-route.min.js | Error Chrome Console [$injector:modulerr]angular-route.min.js 的问题 |错误 Chrome 控制台 [$injector:modulerr]
【发布时间】：2021-04-25 14:32:01
【问题描述】：

!!这里是初学者！！

我遇到了一个错误 - chrome 控制台给了我一个错误：

 [$injector:modulerr]

问题是我没有安装 angular-route.min.js，这是你应该在 1.2 之后的所有 angular 版本中执行的操作。当我安装 angular-route.min.js 时，我的麻烦就开始了，将它放在与 angular 和我的 HTML 文件相同的文件中，在代码中使用 <script src="angular-route.min.js"></script> 引用它，但什么也没发生。

我也放了 angular.module('app.js', ['ngRoute']);进入我的 js 文件。

我的代码中没有错别字，我检查了。最重要的是，控制台给我一个错误，说 angular-route.min.js 没有找到。

欢迎大家帮忙，我用谷歌搜索了很长时间，但没有任何结果。

(function () {
'use strict';
    
angular.module('MSgApp', []);
    controller:('MsgController', MsgController);
angular.module('app.js', ['ngRoute']);

MsgController.$inject = ['$scope'];
function MsgController($scope) {
    $scope.name = "Chris";
    $scope.stateOfBeing = "hungry";
    $scope.sayMessage = function () {
        return "chris likes to eat cookies";
    };
    
    $scope.feedChris = function () {
        $scope.stateOfBeing = "fed";
    };
}

})();

<!DOCTYPE html>
<html ng-app='DIApp'>
<head>
    <meta charset="utf-8">
    <script src="angular.min.js"></script>
    <script src="angular-route.min.js"></script>
    <script src="app.js"></script>
    <title>custom attributes</title>
</head>
<body>
    <div ng-app="app.js"></div>
    <h1>expressions and interpolation</h1>
    
    <div ng-controller='MsgController'>
        {{name}} has a message for you: <br>
        {{sayMessage()}}
        <div>
            <button ng-click="feedChris()">Feed chris</button>
            <br>
            <img ng-src="D:/stuff/coursera angular/chris_{{stateOfBeing}}.png">
        </div>
    </div>
    
</body>
</html>

角度和角度路径未缩小后的错误

【问题讨论】：

我已经附上了控制台的截图，需要什么就问，我真的很想解决这个问题。
@FedericoBaù 不，位置似乎并不重要。
我未缩小角度和角度路线，没有发生太多事情，我现在有两个错误，我会将图片编辑到我的问题中。第一个错误在我什至不知道存在的文件中，它抱怨，然后是抱怨我的 JS 代码第 5 行 .controller 前面的点。
好的，是的，用你得到的 2 个新错误进行更新。但是，如果我理解意味着您按照我的回答正确吗？现在错误不同了，你得到一个新的还是得到 2 个新的？好的，我现在看到了图片，似乎是 2 个不同的和新的。也许是好的，正在寻求解决方案
好的，但是我看到你已经取消了你的自我？所以可能容易出错。您是否尝试过像这样使用 CMD 版本：“ajax.googleapis.com/ajax/libs/angularjs/1.2.7/…”？

标签： javascript html angularjs google-chrome error-handling

【解决方案1】：

根据 StackOverflow --> Angular JS Uncaught Error: [$injector:modulerr]:

编辑：这就是最终解决问题的方法，也是 Chris B 所做的工作：

我在 Coursera 课程中遇到了另一个代码，在将 @ulmer-morozov 的答案中的三个链接放入 head 标签而不是在我的电脑上引用文件之后，这个代码似乎正在工作。大概就是这样，

来自@ulmer-morozov的回答：

在开发环境中，我建议您使用非缩小分布。并且所有错误都变得更加有用！代替angular.min.js，使用angular.js。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular.js">     
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.js">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.js">

来自接受的答案@Lauri Elias：

尝试添加这个：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>

来自@Khanh TO的回答：

尝试添加：

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js">

和：

angular.module('MyApp', ['ngRoute','ngResource']);
function TwitterCtrl($scope,$resource){
}

您应该只调用一次 angular.module 并使用所有依赖项，因为使用您当前的代码，您正在创建一个新的 MyApp 模块覆盖前一个模块。

来自angular documentation：

请注意，使用 angular.module('myModule', []) 将创建模块 myModule 并覆盖任何名为 myModule 的现有模块。采用 angular.module('myModule') 检索现有模块。

【讨论】：