为什么我的控制器无法找到我的服务?

时间:2016-09-13 16:38:37

标签: javascript angularjs service controllers

我一直得到"错误:$ injector:unpr未知提供商"运行此代码时。我已经看了很多类似于这个问题的其他答案,但却无法看到错误的位置。

另外,我是否使用" 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>

1 个答案:

答案 0 :(得分:0)

很抱歉我应该提到,我有一个主应用程序文件,我已经使用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";
    });

}]);