Question

我是AngularJS的新手。然而，任务很简单：从URL解析XML文件并从中创建一个表。

但是某种程度上角度并没有加载。我搜索了类似的问题，但都没有奏效。我的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>

如果装入角度，我应该得到5而不是2 + 3？ 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);
 };

你能给我一些建议吗？

Answer 1

它与您的语法有关。我相信你有2个错误。在你的myscript.js中，你宣布了2个模块。在您的第一个模块中，您错误地声明了工厂。使用.factory而不是myApp.factory

angular.module('myApp.service', [])
.factory('DataSource', ['$http', function ($http) {
  return {
    // do something
  }
}]);

在第二个模块中，您声明了一个名为AppController的函数，而不是调用.controller angular方法。这样做：

angular.module('myApp', ['myApp.service'])
.controller('AppController', ['$scope', 'DataSource', function ($scope, DataSource) {

  // controller code

}]);

Answer 2

您可以使用类似于以下内容的构造在单个模块中完成您的程序：

var app = angular.module('myApp', []);

app.controller('AppController', function($scope, DataSource) {
  // code
});

app.factory('DataSource', ['$http', function($http) {
  // code
}]);

基本上，为您的应用模块创建一个变量，然后调用控制器和工厂，并将您的工厂传递给您的控制器。

HTML页面没有看到AngularJS模块

2 个答案: