Angular JS 错误：[$injector:modulerr]
Posted
技术标签:
【中文标题】Angular JS 错误：[$injector:modulerr]【英文标题】：Angular JS Error: [$injector:modulerr] 【发布时间】：2014-04-12 19:04:40 【问题描述】：编辑：现在我已经实际使用了 angularjs，我不建议任何人做我想要完成的事情。
这是我的第一个 Angularjs 应用程序，所以我是个菜鸟，但仍在努力解决问题。但我在我的 chrome 控制台中收到一条错误消息：
Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.0-beta.1/$injector/modulerr?p0=app&p1=Error…s.org%2F1.3.0-beta.1%2F%24injector%2Fnomod%3Fp0%3Dapp%0A%20%20%20%20at%20E...<omitted>...1) angular.min.js?1394393789:6
(anonymous function) angular.min.js?1394393789:6
(anonymous function) angular.min.js?1394393789:30
r angular.min.js?1394393789:7
e angular.min.js?1394393789:29
cc angular.min.js?1394393789:32
c angular.min.js?1394393789:17
bc angular.min.js?1394393789:18
cd angular.min.js?1394393789:17
(anonymous function) angular.min.js?1394393789:208
l jquery-2.0.3.js:2913
c.fireWith jquery-2.0.3.js:3025
x.extend.ready jquery-2.0.3.js:398
S
将我发送到此页面：http://docs.angularjs.org/error/$injector/modulerr?p0=app&p1=Error:%20%5B$injector:nomod%5D%20http:%2F%2Ferrors.angularjs.org%2F1.3.0- beta.1%2F$injector%2Fnomod%3Fp0%3Dapp%0A%20%20%20%20at%20E
我不会从 1.2 及以下版本移植任何应用程序。我按照下面的一些简单代码的文档..
这是此代码所基于的角度文档：http://docs.angularjs.org/tutorial/step_02
浏览器中显示的是带有 split.description 的标题标签。有什么想法吗？
我的 html
<html lang="en" ng-app="app">
<head>
<!-- My CSS Here -->
</head>
<body>
<div ng-controller="SplitController">
<div ng-repeat="split in splits">
<h4>split.description</h4>
</div>
</div>
</body>
</html>
我的 javascript
var Split = function(data)
this.description = data['description'];
function getSplits(parentid)
var url = "/transaction/split/get";
var ajax = $.ajax(
type: 'GET',
dataType: 'json',
url: url,
data:
parentid: parentid
,
beforeSend: function(data)
,
success: function(data)
data = JSON.parse(data, true);
var splits = [];
for(var i = 0; i < splits.length; i++)
splits.push(new Split(splits[i]));
console.log(splits[i]);
var app = angular.module("app", []);
app.controller('SplitController', function($scope)
$scope.splits = splits;
);
,
error: function(data)
//$('body').html(JSON.stringify(data));
).done(function(data)
);
$(document.ready(function()
getSplits(1);
);
【问题讨论】：
你确定你没有错字 ng-app="app" 【参考方案1】：由于其他人已经说明的原因，我真的不建议这样做，但是您始终可以在某些 jquery 处理程序中获得给定元素的角度 $scope 的句柄。只需像任何人通常那样定义您的控制器（在脚本正文中）。
success: function(data)
... //splits and whatnot
var $scope = angular.element($("div[ng-controller='SplitController']")).scope()
$scope.$apply(function()
$scope.splits = splits;
)
您不能像现在这样定义控制器，因为 ng-app 将在 document.ready 上运行。它将寻找您使用 ng-controller 指定的尚未定义的控制器。定义一个不初始化 'splits' 或任何数据的 SplitController 完全没问题，因为 ng-repeat 将监视 'splits' 的更改并保持 DOM 最新。
【讨论】：
是的，这正是我想做的。我仍然存在的唯一问题是，如果 ng-app 等于某个值，则会弹出错误。如果 ng-app="somename" 它会中断。 发布一个 plnkr 或 jsfiddle，我可以给你看。 Angular 以模块化的方式定义应用程序。您说的是ng-app="app"，但您可能还没有定义“应用程序”模块。 angular.module('app',[]).controller('SplitController', function())【参考方案2】：
您以错误的方式混合了 Angular 和 jQuery 代码。在进行 Angular 编程时，您应该将 jQuery 视为低级。不需要document.ready - Angular 会为你做这件事。另一方面，您应该定义一个应用程序模块并将其名称放在ng-app 指令中。所有其他的东西，比如控制器，都是在那个模块上定义的。
【讨论】：
我很困惑 ng-app 指令是什么？我正在更新我的帖子以显示我已阅读的角度文档。【参考方案3】：这是一个错字...
ng-app"app"
显然需要..
ng-app="app"
另外，我不会等到您的 ajax 调用完成来引导 Angular。您应该只在页面加载时执行此操作，并考虑使用角度工具进行 ajax 调用，例如 $http 服务和可能的 ngRoute 解析属性
【讨论】：
这不是从真实代码中直接复制粘贴，ng="app" 不是问题。【参考方案4】：您的代码甚至与您所说的基于它的代码都不相近。您不应该使用 document.ready，不应该使用 $.ajax，并且您的控制器应该是发出 ajax 请求的人，而不是 ajax 请求的结果本身。
The code for step 2 看起来像这样：
var phonecatApp = angular.module('phonecatApp', []);
phonecatApp.controller('PhoneListCtrl', function($scope)
$scope.phones = [
'name': 'Nexus S',
'snippet': 'Fast just got faster with Nexus S.',
'name': 'Motorola XOOM™ with Wi-Fi',
'snippet': 'The Next, Next Generation tablet.',
'name': 'MOTOROLA XOOM™',
'snippet': 'The Next, Next Generation tablet.'
];
);
如果您想改用 ajax，您应该将 $http 服务注入您的控制器并使用它。
var app = angular.module('app', []);
app.controller('SplitController', function($scope, $http)
$http.get( // or post, put, delete
'/transaction/split/get',
some data
).success(function(returndata)
$scope.splits = returndata;
);
);
【讨论】：
我只想使用 Angularjs 的模板功能。我正在从事的项目非常大，可以在不重写应用程序的情况下以 Angular 方式完成所有工作。我怎样才能做到这一点？基本上我想要一些类似于控制器（mydata）的东西，然后它用我发送的数据填充 ng-repeat。我是否在看 Angular 的错误部分来执行此操作？ 看来我要找的是服务？ ***.com/questions/20181323/…【参考方案5】：如果有人使用$routeProvider，可能是以下错误：
在我的情况下，我使用$routeProvider.when() 没有 url 作为第一个参数，就是这样，当我添加如下所示的 url 时，错误消失了。
$routeProvider.when('/post/:id',
templateUrl: 'views/post.html',
controller: 'PostController'
)
【讨论】：
以上是关于Angular JS 错误：[$injector:modulerr]的主要内容，如果未能解决你的问题，请参考以下文章
Angular JS 错误：[$injector:modulerr]
未捕获的错误：Angular JS 中的 [$injector:modulerr] 和 ngRoute 错误
Angular 从 1.6.6 升级到 6 时出现 $Injector 错误