AngularJS $injector:modulerr与$injector:unpr错误排查求助

嘿，我看了你遇到的问题，这个$injector:unpr错误指向很明确——Angular找不到SweetAlert的提供者，咱们一步步拆解问题来解决它：

核心问题：缺少Angular版SweetAlert的封装库 #

你在app.js里依赖了oitozero.ngSweetAlert这个Angular模块，但页面里只引入了原生的SweetAlert JS/CSS。原生SweetAlert是纯前端插件，不是Angular模块，所以Angular根本不知道SweetAlertProvider是什么，自然会报错。

具体修复步骤 #

1. 补充Angular版SweetAlert的JS文件 #

你需要下载oitozero.ngSweetAlert对应的核心JS文件（一般叫ngSweetAlert.min.js），把它放到项目目录里，然后在页面中引入，位置要在Angular核心之后、自定义脚本之前。

2. 调整脚本引入顺序（重要！） #

你当前的脚本顺序有问题，还重复引入了jQuery，容易导致依赖加载冲突。按下面的顺序调整：

<!-- 所有样式先引入 -->
<link href="css/materialize.min.css" type="text/css" rel="stylesheet" media="screen,projection">
<link href="css/style.min.css" type="text/css" rel="stylesheet" media="screen,projection">
<link href="css/custom/custom.min.css" type="text/css" rel="stylesheet" media="screen,projection">
<link href="js/plugins/prism/prism.css" type="text/css" rel="stylesheet" media="screen,projection">
<link href="js/plugins/perfect-scrollbar/perfect-scrollbar.css" type="text/css" rel="stylesheet" media="screen,projection">
<link href="css/userManagementCss.css" type="text/css" rel="stylesheet" media="screen,projection">
<link href="js/plugins/sweetalert/dist/sweetalert.css" type="text/css" rel="stylesheet" media="screen,projection">

<!-- 脚本按依赖顺序引入 -->
<script type="text/javascript" src="js/plugins/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="libs/angular/angular.min.js"></script>
<script type="text/javascript" src="libs/angular-route/angular-route.min.js"></script>
<script type="text/javascript" src="libs/angular-utils-pagination/dirPagination.js"></script>
<!-- 新增：引入ngSweetAlert的Angular封装库 -->
<script type="text/javascript" src="js/plugins/sweetalert/ngSweetAlert.min.js"></script>
<script type="text/javascript" src="js/plugins/angular-materialize.js"></script>
<!-- 自定义脚本：先控制器，再路由，最后主app -->
<script type="text/javascript" src="js/controller/UserManagementController.js"></script>
<script type="text/javascript" src="js/appRoutes.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<!-- 其他第三方插件脚本 -->
<script type="text/javascript" src="js/materialize.min.js"></script>
<script type="text/javascript" src="js/plugins/prism/prism.js"></script>
<script type="text/javascript" src="js/plugins/perfect-scrollbar/perfect-scrollbar.min.js"></script>
<script type="text/javascript" src="js/plugins/sweetalert/dist/sweetalert.min.js"></script>
<script type="text/javascript" src="js/plugins.min.js"></script>
<script type="text/javascript" src="js/custom-script.js"></script>

注意：ngSweetAlert.min.js的路径要根据你实际存放的位置修改，确保文件存在。

3. 检查控制器的注入方式 #

确保你的UserManagementController是显式注入SweetAlert的，避免压缩或隐式注入导致的问题：

angular.module('UserManagementController', [])
.controller('UserManagementController', ['$scope', 'SweetAlert', function($scope, SweetAlert) {
    // 你的控制器逻辑代码
}]);

4. 验证模块依赖 #

你的app.js里已经正确声明了oitozero.ngSweetAlert依赖，这部分没问题，只要对应的JS文件加载成功，Angular就能识别到这个模块。

另外提一句，之前你加angular-resource报错翻倍，也是因为没引入对应的angular-resource.min.js文件，不过这个和当前错误无关，先搞定SweetAlert的问题再说。

内容的提问来源于stack exchange，提问作者Mark