javascript AngularJs 注入器模块错误
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/25149560/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
AngularJs Injector Module Error
提问by Italo Ayres
i'm new in AngularJs (started an couple hours ago) and i'm trying to complete the AngularJs in 60 minutes'ish tutorial. But i got stucked on the first controllers example. This is my code:
我是 AngularJs 的新手(几个小时前开始),我正在尝试在 60 分钟的教程中完成 AngularJs。但是我被困在第一个控制器示例上。这是我的代码:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<title>Angular Js</title>
<meta charset="iso-8859-1">
</head>
<body>
<div class="container" data-ng-controller="CustomerController">
<input type="text" ng-model="name"> {{name}}
<ul>
<li data-ng-repeat="cust in customers">
{{ cust.name}} - {{cust.city}}
</li>
</ul>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.17/angular.js"></script>
<script>
function CustomerController($scope)
{
$scope.customers = [
{name:'Leonardo', city:'Phoenix'},
{name:'Michelangelo', city:'Los Angeles'},
{name:'Rafael', city:'New York'},
{name:'Donatello', city:'Texas City'}
];
}
</script>
</body>
</html>
This is the error i got from the ChromeDev Console:
这是我从 ChromeDev 控制台得到的错误:
Uncaught Error: [$injector:modulerr] Failed to instantiate module myApp due to:
Error: [$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify th...<omitted>...2) angular.js:78
(anonymous function) angular.js:78
(anonymous function) angular.js:4003
forEach angular.js:328
loadModules angular.js:3964
createInjector angular.js:3904
doBootstrap angular.js:1500
bootstrap angular.js:1515
angularInit angular.js:1427
(anonymous function) angular.js:23362
trigger angular.js:2653
(anonymous function) angular.js:2933
forEach angular.js:328
eventHandler angular.js:2932
As a newbie, I dont want to get into injector or modules and stuff. Since the tutorial is get to work only with this piece of code.
作为一个新手,我不想进入注入器或模块之类的东西。由于本教程仅适用于这段代码。
Thanks!
谢谢!
回答by user273895
first you defined ng-app="myApp" but you didn't define any module named "myApp", so just use ng-app.
首先你定义了 ng-app="myApp" 但你没有定义任何名为 "myApp" 的模块,所以只需使用 ng-app。
second, seems like the angular version you used 1.3.0-beta.17 doesn't work if you don't declare a module like this
其次,如果您不声明这样的模块,您使用的 1.3.0-beta.17 的角度版本似乎不起作用
angular.module("myApp", [])
angular.module("myApp", [])
if you want to to make the example you posted work, use a different angular version, like 1.2.5
如果您想让您发布的示例工作,请使用不同的角度版本,例如 1.2.5
here's a working jsbinof your code
这是您的代码的有效jsbin
回答by ebram khalil
There are 2 solutions:
有2种解决方案:
First, as your error says: "Module 'myApp' is not available!". You need first to define the module myApp
, so that angular could instantiateit. Then add your controller's constructor function to myApp
module using the .controller()
method.
首先,正如您的错误所说:“模块‘myApp’不可用!”。您首先需要定义 modulemyApp
,以便 angular 可以实例化它。然后使用方法将控制器的构造函数添加到myApp
模块中。.controller()
var myApp = angular.module('myApp', []);
myApp.controller('CustomerController', ['$scope',
function($scope) {
$scope.customers = [{
name: 'Leonardo',
city: 'Phoenix'
}, {
name: 'Michelangelo',
city: 'Los Angeles'
}, {
name: 'Rafael',
city: 'New York'
}, {
name: 'Donatello',
city: 'Texas City'
}];
}
]);
Second, just remove myApp
from your <html>
tag and everything will work just fine
其次,只需myApp
从您的<html>
标签中删除,一切都会正常进行
<html ng-app="">
回答by davibq
I think you should always declare at least one module.
我认为您应该始终声明至少一个模块。
Try:
尝试:
<script>
var myApp = angular.module('myApp',[]);
function CustomerController($scope)
{
$scope.customers = [
{name:'Leonardo', city:'Phoenix'},
{name:'Michelangelo', city:'Los Angeles'},
{name:'Rafael', city:'New York'},
{name:'Donatello', city:'Texas City'}
];
}
</script>