我的应用程序中的未知提供商

Question

我正在尝试将 HTTP 请求放入服务文件中，以便在多个控制器中使用此功能，但出现以下错误，我尝试了多种解决方案但仍然出现此错误

这是我的 controller.js

.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/LatestMovies', {
templateUrl: 'LatestMovies/LatestMovies.html',
controller: 'LatestMoviesCtrl'

});
}])


.controller('LatestMoviesCtrl', 
['myServices','$scope',function(myServices,$scope) {



$scope.movies = myServices.getLatestMovies();
console.log($scope.movies ,'ggg')
}
]);

这是我的 services.js

   angular.module('myApp', ['ngRoute'])

 .factory('myServices', function ($http) {
return {
    getLatestMovies : function () {
            var service ={
                movies : '',
                details : []
            }
            var base = 'http://api.themoviedb.org/3';
            var service = '/movie/popular?page=1&language=en- 
             US&api_key=';
            var apiKey = '';
            var callback = 'JSON_CALLBACK';
            var url =base + service + apiKey + '&callback=' + callback;
            //$scope.results = 'requesting...';

            $http.jsonp(url).then(function(result, status) {
                //$scope.results = JSON.stringify(data);
                service.movies = result.data;
                angular.forEach(result.data.results, function (value, 
                index) {
                    service.details.push(value);
                });

            },function(result, status) {
                service.movies = 'Maybe you missed your API key?' + 
       JSON.stringify(result.data);
            });

            return service.movies;
        }
    }

    });

错误

angular.js:14199 错误：[$injector:unpr] 未知提供者：myServicesProvider http://errors.angularjs.org/1.5.11/$injector/unpr?p0=myServicesProvider%20%3C-%20myServices%20%3C-%20LatestMoviesCtrl 在http://localhost:8000/bower_components/angular/angular.js:68:12 在http://localhost:8000/bower_components/angular/angular.js:4563:19 在 Object.getService [as get] (http://localhost:8000/bower_components/angular/angular.js:4716:32) 在http://localhost:8000/bower_components/angular/angular.js:4568:45 在 getService (http://localhost:8000/bower_components/angular/angular.js:4716:32) 在 injectionArgs (http://localhost:8000/bower_components/angular/angular.js:4741:58) 在 Object.instantiate (http://localhost:8000/bower_components/angular/angular.js:4783:18) 在 $controller

Answer 1

你需要注入 $http 模块来发送 api 调用

 .factory('myServices', ['$http',function ($http) {
return {
    getLatestMovies : function () {
            var service ={
                movies : '',
                details : []
            }
            var base = 'http://api.themoviedb.org/3';
            var service = '/movie/popular?page=1&language=en- 
             US&api_key=';
            var apiKey = '';
            var callback = 'JSON_CALLBACK';
            var url =base + service + apiKey + '&callback=' + callback;
            //$scope.results = 'requesting...';

            $http.jsonp(url).then(function(result, status) {
                //$scope.results = JSON.stringify(data);
                service.movies = result.data;
                angular.forEach(result.data.results, function (value, 
                index) {
                    service.details.push(value);
                });

            },function(result, status) {
                service.movies = 'Maybe you missed your API key?' + 
       JSON.stringify(result.data);
            });

            return service.movies;
        }
    }

    }]);

Answer 2

您似乎已经创建了两次 myApp 模块，首先是在 services.js 中，然后是在 controller.js 中。所以基本上发生的事情是

1. 首先加载services.js 时，它会创建myApp 角度模块和myServices 服务。
2. 当controllers.js 文件加载时，在文件的开头，您使用angular.module('myApp', ['ngRoute']) 重新创建了myApp 模块。它重新创建一个新的myApp 模块并向其注册config 和LatestMoviesCtrl。
3. 因此 myServices 依赖项不可用。

在注册更多文件时解决问题。

angular.module('myApp')
.config(...)
.controller('LatestMoviesCtrl', .... )