Angular Provider에 종속성 삽입

Question

제공자에게 더 깨끗한 주입 방법이 있는지 궁금합니다. 내가 지금하고 있기 때문에, 나는 http = null을 가져야하고, $ get에 http = http http를 설정하여 내 함수에서 사용할 수있게해야한다.

이

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 

자바 스크립트 :

(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를 공개하려는 경우 for 응용 프로그램 전체 구성을 어플은 코드에서, 대부분의 기능 만 구성 단계 후 사용할 수 있습니다 무엇을보고에서

를 시작하기 전에 이루어져야합니다. 고려해야 할 두 가지 옵션이 있습니다.

[] 구성 단계에서 설정해야하는 구성이없는 경우 공급자 대신 서비스를 만드는 것이 좋습니다.

.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; 
     }); 
     }; 
}]); 

[2] 당신이 어떤 구성이있는 경우, 단순히 위의 서비스를 복사하고 공급자의 $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과 같이 제공해야합니다. 위에 제공된 견적은 해당 가이드에서 제공 한 것입니다.