AngularJS Error: $injector:unpr Unknown Provider githubProvider

问题

I'm trying to build my own service by following the example in the documentation for the factory methodology. I think I've done something wrong however because I continue to get the unknown provider error

index.html

    <!DOCTYPE html>
<html ng-app="githubViewer">

<head>
  <script data-require="angular.js@1.4.3" data-semver="1.4.2" src="https://code.angularjs.org/1.4.2/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
  <script src="github.js"></script>
</head>


<body ng-controller="MainController">

  <div>
    <h1>{{message}}</h1>
  </div>
  <div>
    {{ error }}
  </div>
  {{ countdown }}
  <form name="searchUser" ng-submit="search(username)">
    <input type="search" required placeholder="Username to find" ng-model="username">
    <input type="submit" value = "search" >

  </form>


  <div ng-include="userdetails" ng-show = "user"></div>


</body>

</html>

script.js

    (function() {

  angular
    .module("githubViewer", [])
    .controller("MainController",MainController);
  //  .controller("MainController", 
  //  ["$scope", "github","$interval","$log","$anchorScroll","$location", MainController]);

  MainController.$inject = ["$scope", "$http","$interval","github"];



  function MainController($scope,github,$interval,$log,$achorScroll,$location) {
  //  var onUserComplete = function(response) {
  //    $scope.user = response.data;
  //    $http.get($scope.user.repos_url)
  //         .then(onRepos,onError)
  //  };

  var onUserComplete = function(data) {
      $scope.user = data;
     gethub.getRepos($scope.user).then(onRepos,onError)
    };


    var onRepos = function(data){
      $scope.repos = data;
      $location.hash("userDetails");
      $anchorScroll();
    };

    var onError = function(reason) {
      $scope.error = "could not display data" ;

    };

    $scope.search = function(username) {
      $log.info("searching for "+ username);
      github.getUser(username).then(onUserComplete, onError);

        if(countdownInterval){
          $interval.cancel(countdownInterval)
          $scope.countdown = null;
        }

    };

    var decrementCountdown = function(){
      $scope.countdown -= 1; 
      if($scope.countdown < 1){
        $scope.search($scope.username)
      }
    };
    var countdownInterval = null;
    var startCountdown = function(){
      countdownInterval = $interval(decrementCountdown,1000,$scope.countdown);

    };

    $scope.username = "Angular";
    $scope.message = "GitHub Viewer!";
    $scope.repoSortOrder ="-stargazers_count";
    $scope.userdetails ="userdetails.html";
    $scope.countdown = 5;
    startCountdown();
  };

})();

github.js

(function(){

  var github = function($http){

    var getUser = function(username){
      return $http.get("https://api.github.com/users/" + username)
                  .then(function(response){
                    return response.data;

                  });

    };

    var getRepos = function(user){
      return $http.get(user.repos_url)
                  .then(function(response){
                    return response.data;

                  });
    };

    return{
          getUser : getUser,
          getRepos ; getRepos

    };
  };


  var module = angular.module("githubViewer");
  module.factory("github",github);

}());

console error :

Error: [$injector:unpr] Unknown provider: githubProvider <- github <- MainController
http://errors.angularjs.org/1.4.2/$injector/unpr?p0=githubProvider%20%3C-%20github%20%3C-%20MainController
    at REGEX_STRING_REGEXP (angular.js:68)
    at angular.js:4264
    at Object.getService [as get] (angular.js:4411)
    at angular.js:4269
    at getService (angular.js:4411)
    at Object.invoke (angular.js:4443)
    at ident.$get.extend.instance (angular.js:9001)
    at nodeLinkFn (angular.js:8111)
    at compositeLinkFn (angular.js:7543)
    at compositeLinkFn (angular.js:7547)

Please point me to the right direction.

回答1:

You have mismatch in the dependency array, make sure all the dependency has injected correctly before using them.

MainController.$inject = ['$scope','github','$interval','$log','$achorScroll','$location'];

Additionaly you need to replace ; by : in your github factory

return{
      getUser : getUser,
      getRepos : getRepos //<--correction in this line

};

来源：https://stackoverflow.com/questions/32530989/angularjs-error-injectorunpr-unknown-provider-githubprovider-github-mai

标签

javascript

angularjs

dependency-injection

angularjs-factory

angularjs-module

AngularJS Error: $injector:unpr Unknown Provider githubProvider <- github <- MainController

问题

回答1: