私のコントローラが私のサービスを見つけることができないのはなぜですか？

Question

このコードを実行すると、 "Error：$ injector：unpr Unknown Provider"が引き続き表示されます。私はこの問題に似た多くの他の答えを見てきましたが、どこにエラーがあるのか​​分かりません。

また、私はこのサービスを "myService（）"で正しく呼びますか？

私はAngularには比較的新しいので、助けや助言をいただければ幸いです。前もって感謝します。

マイサービス

angular.module('APP') 

    .service('myService', ['$scope' function($scope) { 

    $scope.search = {}; 

    $scope.resetFilters = function() { 
     // needs to be a function or it won't trigger a $watch 
     $scope.search = {}; 
    }; 

    // pagination controls 
    $scope.currentPage = 1; 
    $scope.totalItems = $scope.videos.length; 
    $scope.entryLimit = 5; // videos per page 
    $scope.noOfPages = Math.ceil($scope.totalItems/$scope.entryLimit); 

    // $watch search to update pagination 
    $scope.$watch('search', function (newVal, oldVal) { 
     $scope.filtered = filterFilter($scope.videos, newVal); 
     $scope.totalItems = $scope.filtered.length; 
     $scope.noOfPages = Math.ceil($scope.totalItems/$scope.entryLimit); 
     $scope.currentPage = 1; 
    }, true); 

}]); 

マイコントローラー

angular.module('APP') 

    .filter('startFrom', function() { 
     return function (input, start) { 
      if (input) { 
       start = +start; 
       return input.slice(start); 
      } 
      return []; 
     }; 
    }) 

    .controller('dbCtrl', ['$scope', '$http', 'filterFilter', 'myService', function ($scope, $http, filterFilter, myService) { 

    $http.get("js/science.php") 
     .success(function(data){ 
      $scope.videos = data; 

      myService(); 
     }) 
     .error(function() { 
      $scope.data = "error in fetching data"; 
    }); 

}]); 

マイリンク

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script> 
<script src="https://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js"></script> 

<!-- CDN's and API's--> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.js"></script> 
<script src="https://www.youtube.com/iframe_api"></script> 

<!-- Services --> 
<script src="controllers/myService.js"></script> 

<!-- Dependencies --> 
<script src="js/ui-router-title.js"></script> 
<script src="js/angular-youtube-embed.js"></script> 
<script src="js/angular-ui-router.min.js"></script> 
<script src="js/app.js"></script> 

<!-- Controllers --> 
<script src="controllers/headerCtrl.js"></script> 
<script src="controllers/dbCtrl.js"></script> 
<script src="controllers/scienceCtrl.js"></script> 
<script src="controllers/politicsCtrl.js"></script> 
<script src="controllers/pageCtrl.js"></script> 
<script src="controllers/tabsCtrl.js"></script> 
<script src="controllers/modalCtrl.js"></script> 

Answer 1

私が言及している必要があります申し訳ありませんが、私は私のアプリの依存関係を宣言しているメインのアプリケーションファイルを持っていますangular.module('APP', []);サービスに$ scopeを挿入できない限り、私は本当に改ざんコードを取得して再利用できるようにしようとしています。どのように私はこれを達成することができますか？途中ですぐに返信いただきありがとうございます。

ここでは再利用可能にしたいページングコードの元のコントローラです。

angular.module('APP') 

    .filter('startFrom', function() { 
     return function (input, start) { 
      if (input) { 
       start = +start; 
       return input.slice(start); 
      } 
      return []; 
     }; 
    }) 

    .controller('dbCtrl', ['$scope', '$http', 'filterFilter', function ($scope, $http, filterFilter) { 

    // Link to PHP for mySQL content 
    $http.get("js/science.php") 
     .success(function(data){ 
     $scope.videos = data; // Array named 'data' 

     // FROM HERE 
     //===================== 
     $scope.search = {}; 

     $scope.resetFilters = function() { 
      // needs to be a function or it won't trigger a $watch 
      $scope.search = {}; 
     }; 

     // pagination controls 
     $scope.currentPage = 1; 
     $scope.totalItems = $scope.videos.length; 
     $scope.entryLimit = 5; // videos per page 
     $scope.noOfPages = Math.ceil($scope.totalItems/$scope.entryLimit); 

     // $watch search to update pagination 
     $scope.$watch('search', function (newVal, oldVal) { 
      $scope.filtered = filterFilter($scope.videos, newVal); 
      $scope.totalItems = $scope.filtered.length; 
      $scope.noOfPages = Math.ceil($scope.totalItems/$scope.entryLimit); 
      $scope.currentPage = 1; 
     }, true); 
     // TO HERE REUSABLE 
     //===================== 

     }) 

     .error(function() { 
      $scope.data = "error in fetching data"; 
    }); 

}]);