Question

我正在尝试连接一个简单的数据服务，以便从服务器检索数据以进行http调用。我正在使用TypeScript编写代码。出于某种原因，我无法获得服务以查看其依赖项。这是由Typescript生成的服务

var app = angular.module('app',[]);
app.constant('baseUrl', 'http://localhost:63342');

//This follows the pattern created by Typescript
var myService = function(){
    function myService($http, baseUrl){
        this.$http = $http;
        this.baseUrl = baseUrl;
        this.http = typeof this.$http;
        this.url = typeof this.baseUrl;
    }
    myService.$inject = ['$http', 'baseUrl'];
    return myService
}

app.factory('myService', [
    '$http', 'baseUrl',
    myService
]);

app.controller('myCtrl',
        ['$scope', 'myService',
            function($scope, myService){
                $scope.httpType = myService.http;
                $scope.urlType = myService.url}]
);

当我在本地运行代码时，p标签会在其上设置ng-bind属性。但是，当然，他们没有任何东西。当我打破$ scope赋值时，myService可用并且它有$ inject变量，但是没有其他4个变量。 Typescript和angular的可用示例相当薄。必须有一些非常基本的我做错了。

Here is a fiddle with the code.我不知道为什么小提琴不会转换范围变量。

Answer 1

问题在于：

var myService = function(){
    function myService($http, baseUrl){
        this.$http = $http;
        this.baseUrl = baseUrl;
        this.http = typeof this.$http;
        this.url = typeof this.baseUrl;
    }
    myService.$inject = ['$http', 'baseUrl'];
    return myService
}

app.factory('myService', [
    '$http', 'baseUrl',
    myService
]);

Angular会使用myService不接受的参数$http,baseUrl来调用myService。所以你需要这样做：

var myService = function($http, baseUrl){
            this.$http = $http;
            this.baseUrl = baseUrl;
            this.http = typeof this.$http;
            this.url = typeof this.baseUrl;
}
myService.$inject = ['$http', 'baseUrl'];

或者，如果您想使用TypeScript类，请使用我为控制器推荐的相同模式：http://www.youtube.com/watch?v=WdtVn_8K17E&hd=1并使用service代替factory

Answer 2

我能够按照模块模式使其工作以公开您的服务属性，以及使用内联表示法来声明服务。在这里查看plunker：http://plnkr.co/edit/tVajIshcCegIwywGWL9Y?p=preview。代码粘贴在下面的脚本：

var app = angular.module('app',[]);
app.constant('baseUrl', 'http://developer.echonest.com/api/v4/artist/news?api_key=FILDTEOIK2HBORODV&id=7digital-US:artist:304&format=json');


app.factory('myService', ['$http', 'baseUrl', function($http,baseUrl){
        var http = typeof $http;
        var url = typeof baseUrl;
        return {
          http: http,
          url : url
        };
    }]);

app.controller('myCtrl',
               ['$scope', 'myService', 
               function($scope, myService){
               $scope.httpType = myService.http;
               $scope.urlType = myService.url;
               }]              
              );

由angularjs工厂创建的数据服务不会产生依赖关系

2 个答案: