HTML页面看不到AngularJS模块
[英]HTML page doesn't see AngularJS module
问题描述
I am entirely new to AngularJS. 
我是AngularJS的新手。 The task is however simple: to parse XML file from the url and make a table out of it. 但是，任务很简单：从url解析XML文件并从中创建一个表。
Yet somehow angular doesn't load. 但是以某种方式不会加载角度。 I searched similar questions, but neither worked. 我搜索了类似的问题，但均无济于事。 My index.html: 我的index.html：
<!doctype html>
<html ng-app="myApp">
<head>
<title>jj</title>
<script src="~/Scripts/angular.min.js"></script>
<script src="~/Scripts/angular.intellisense.js"></script>
<script src="~/Scripts/angular.js"></script>
<script src="~/Scripts/myscript.js"></script>
</head>
<body>
<div class="jumbotron">
<h1>ASP.NET</h1>
<p class="lead">Text.</p>
</div>
<div ng-controller="AppController">
<h3>for example 2+3= {{3+2}}</h3>
</div>
</div>
</body>
</html>
I should get 5 instead of 2+3 if angular is loaded? 如果加载了angular，我应该得到5而不是2 + 3？ myscript.js currently looks like: myscript.js当前看起来像：
angular.module('myApp.service', []).
myApp.factory('DataSource', ['$http', function ($http) {
return {
get: function(file,callback,transform){
$http.get(
file,
{transformResponse:transform}
).
success(function(data, status) {
console.log("Request succeeded");
callback(data);
}).
error(function(data, status) {
console.log("Request failed " + status);
});
}
}
}]);
angular.module('myApp', ['myApp.service']);
var AppController = function ($scope, DataSource) {
var SOURCE_FILE = "guitars.xml";
xmlTransform = function (data) {
console.log("transform data");
var x2js = new X2JS();
var json = x2js.xml_str2json(data);
return json.customers.customer;
};
setData = function (data) {
$scope.dataSet = data;
};
DataSource.get(SOURCE_FILE, setData, xmlTransform);
};
Can you give me some advice? 你能给我一些建议吗？
2 个解决方案
解决方案1
3 已采纳 2015-05-30 12:48:37
It has to do with your syntax. 它与您的语法有关。 I believe you have 2 errors. 我相信您有2个错误。 In your myscript.js you are declaring 2 modules. 在myscript.js中，您声明了2个模块。 In your first module you are incorrectly declaring a factory. 在第一个模块中，您错误地声明了工厂。 Use .factory not myApp.factory 使用.factory而不是myApp.factory
angular.module('myApp.service', [])
.factory('DataSource', ['$http', function ($http) {
return {
// do something
}
}]);
In your second module you declare a function called AppController instead of calling the .controller angular method. 在第二个模块中，您声明一个名为AppController的函数，而不是调用.controller angular方法。 Do this instead: 改为这样做：
angular.module('myApp', ['myApp.service'])
.controller('AppController', ['$scope', 'DataSource', function ($scope, DataSource) {
// controller code
}]);
解决方案2
2 2015-05-30 13:10:11
You can accomplish your program in a sole module by using a construct similar to what follows: 您可以使用类似于以下内容的结构在一个单独的模块中完成程序：
var app = angular.module('myApp', []);
app.controller('AppController', function($scope, DataSource) {
// code
});
app.factory('DataSource', ['$http', function($http) {
// code
}]);
Basically, create a variable for your app module, then call controller and factory, and pass your factory into your controller. 基本上，为您的应用模块创建一个变量，然后调用controller和factory，然后将工厂传递到控制器中。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.