服务不会注入控制器

Question

我过去做过一些 Angular 应用程序，但从未真正使用过模块。我现在正在创建一个 Ionic 应用程序（使用 Angular），但出于某种原因，我无法将我的服务注入控制器。

controllers.js

angular.module('myapp.controllers', [])
.controller('StreamCtrl', ['$scope', 'StreamService',
function($scope, StreamService) {
    $scope.playlists = [1,2,3,4];
}]);

services.js

angular.module('myapp.services', [])
.factory('StreamService', ['$scope', function($scope) {
    var self = {
        'fetching' : false,
        'streamItems' : []
    };
    return self;
]);

app.js

angular.module('myapp', ['ionic',
                        'myapp.services',
                        'myapp.controllers',
                        'ngCordova',
                        'LocalStorageModule'])
// And lots of other code that isn't needed for this question.

因此，当我尝试加载 StreamCtrl 时，我最终收到以下错误：

Error: [$injector:unpr] Unknown provider: $scopeProvider <- $scope <-StreamService
http://errors.angularjs.org/1.3.6/$injector/unpr?p0=<ion-nav-view name="menuContent" class="view-container" nav-view-transition="ios">copeProvider%20%3C-%20%24scope%20%3C-%20StreamService
at REGEX_STRING_REGEXP (http://localhost:8100/lib/ionic/js/ionic.bundle.js:7888:12)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:11806:19
at Object.getService [as get] (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11953:39)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:11811:45
at getService (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11953:39)
at Object.invoke (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11985:13)
at Object.enforcedReturnValue [as $get] (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11847:37)
at Object.invoke (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11994:17)
at http://localhost:8100/lib/ionic/js/ionic.bundle.js:11812:37
at getService (http://localhost:8100/lib/ionic/js/ionic.bundle.js:11953:39)

Answer 1

你的错误清楚地表明 StreamService 工厂内部有问题。

你永远无法在 factory 中注入 $scope。删除 $scope 依赖项将解决您的问题。

Factory 主要用于公开单例方法、公共和可共享数据。通常我们编写任何服务调用或方法，任何使用其依赖项注入它的模块都可以访问这些服务调用或方法。

工厂

angular.module('myapp.services', [])
.factory('StreamService', [function() {
    var self = {
        'fetching': false,
        'streamItems': []
    };
    return self;
}]);

Working fiddle.

希望对您有所帮助。谢谢。

Answer 2

看到这个工作 fiddle ,

您将服务视为控制器，永远不要将 $scope 注入服务，它不存在

var myApp = angular.module('myApp',['myapp.services','myapp.controllers']);

angular.module('myapp.controllers', [])
.controller('StreamCtrl', ['$scope', 'StreamService',
function($scope, StreamService) {
    $scope.playlists = [1,2,3,4];
}]);

angular.module('myapp.services', []).factory('StreamService',  function() {
    var self = {
        'fetching' : false,
        'streamItems' : []
    };
    return self;}
);

服务不会注入控制器

Service will not inject into controller

javascript

angularjs

angularjs-factory

angular-services

ionic-framework