依赖注入角提供者

Question

我想知道是否有任何更清洁的方式注入提供者。正如我现在这样做，我必须有http = null，然后在$ get中设置http = $ http，以便我可以在我的函数中使用它。下面是我的供应商代码

的CoffeeScript：

do -> 
    githubProvider =() -> 
    http = null 
    getUser =(username) -> 
     return http.get("https://api.github.com/users/" + username) 
        .then (response)-> 
        return response.data 

    getRepos =(user) -> 
     return http.get(user.repos_url) 
        .then (response)-> 
        return response.data 

    getRepoDetails =(username, repoName) -> 
     return http.get("https://api.github.com/repos/" + username + "/" + repoName) 
        .then (response)-> 
        return response.data 

    getRepoCollaborators =(repo) -> 
     return http.get(repo.contributors_url) 
      .then (response)-> 
       return response.data 

    this.$get =["$http", ($http) -> 
     http = $http 
     return { 
     getUser: getUser, 
     getRepos: getRepos, 
     getRepoDetails: getRepoDetails, 
     getRepoCollaborators: getRepoCollaborators 
     }] 
    return 
    app = angular.module("githubViewer") 
    app.provider("githubProvider", [githubProvider]) 
    return 

的JavaScript：

(function() { 
    var app, githubProvider; 
    githubProvider = function() { 
     var getRepoCollaborators, getRepoDetails, getRepos, getUser, http; 
     http = null; 
     getUser = function(username) { 
     return http.get("https://api.github.com/users/" + username).then(function(response) { 
      return response.data; 
     }); 
     }; 
     getRepos = function(user) { 
     return http.get(user.repos_url).then(function(response) { 
      return response.data; 
     }); 
     }; 
     getRepoDetails = function(username, repoName) { 
     return http.get("https://api.github.com/repos/" + username + "/" + repoName).then(function(response) { 
      return response.data; 
     }); 
     }; 
     getRepoCollaborators = function(repo) { 
     return http.get(repo.contributors_url).then(function(response) { 
      return response.data; 
     }); 
     }; 
     this.$get = [ 
     "$http", function($http) { 
      http = $http; 
      return { 
      getUser: getUser, 
      getRepos: getRepos, 
      getRepoDetails: getRepoDetails, 
      getRepoCollaborators: getRepoCollaborators 
      }; 
     } 
     ]; 
    }; 
    app = angular.module("githubViewer"); 
    app.provider("githubProvider", [githubProvider]); 
    })(); 

Answer 1

由于AngularJS Developer's Guide提到什么：

您应该只使用提供食谱当你想公开一个API 应用范围配置的 应用程序启动

之前从我看到你的代码，大部分功能只能在配置阶段后使用，必须做。你有两个选择要考虑。

[]如果您在配置阶段没有需要设置的任何配置，那么考虑创建一个服务而不是提供者。

.service('github', ['$http', function($http) { 
     this.getUser = function(username) { 
     return $http.get("https://api.github.com/users/" + username).then(function(response) { 
      return response.data; 
     }); 
     }; 
     this.getRepos = function(user) { 
     return $http.get(user.repos_url).then(function(response) { 
      return response.data; 
     }); 
     }; 
     this.getRepoDetails = function(username, repoName) { 
     return $http.get("https://api.github.com/repos/" + username + "/" + repoName).then(function(response) { 
      return response.data; 
     }); 
     }; 
     this.getRepoCollaborators = function(repo) { 
     return $http.get(repo.contributors_url).then(function(response) { 
      return response.data; 
     }); 
     }; 
}]); 

[]如果您有任何配置，则只需复制以上的服务并使其在供应商的$get定义。

.provider('github', function() { 
     var configuration = {}; 

     this.setConfiguration = function(configurationParams) { 
     configuration = configurationParams; 
     }; 

     this.$get = ['$http', function($http) { 
     // you can choose to use your configuration here.. 

     this.getUser = function(username) { 
      return $http.get("https://api.github.com/users/" + username).then(function(response) { 
      return response.data; 
      }); 
     }; 
     this.getRepos = function(user) { 
      return $http.get(user.repos_url).then(function(response) { 
      return response.data; 
      }); 
     }; 
     this.getRepoDetails = function(username, repoName) { 
      return $http.get("https://api.github.com/repos/" + username + "/" + repoName).then(function(response) { 
      return response.data; 
      }); 
     }; 
     this.getRepoCollaborators = function(repo) { 
      return $http.get(repo.contributors_url).then(function(response) { 
      return response.data; 
      }); 
     }; 
     }]; 
}); 

则这提供者可以在配置阶段，像这样使用：

.config(function(githubProvider) { 
    githubProvider.setConfiguration({ 
    dummyData: 'Dummy Data' 
    }); 
}); 

，并在运行阶段或在控制器：

.run(function(github) { 
    github.getUser('ryebalar').then(function(data) { 
    console.log(data); 
    }); 
}); 

这里有一个指南，以帮助您与供应商，developer's guide，请注意，我上面提供的报价是从该指南。