如何在Angular中添加服务以便控制器可以使用它?

时间:2015-08-28 17:41:02

标签: javascript angularjs cordova phonegap-plugins

我有一个基本的角度设置。我想添加另一个工厂服务,以便mainCtrl可以使用它。

这是我的 controller.js

angular.module('Manalator.controllers', [])
    .controller('MainCtrl', ['$scope', function ($scope, manaFactory) {
        manaFactory.testString();
    }]);

这是我的 services.js

angular.module('Manalator.services', [])
    .factory('cordovaReady', [function () {
        return function (fn) {
            var queue = [],
                impl = function () {
                    queue.push([].slice.call(arguments));
                };

            document.addEventListener('deviceready', function () {
                queue.forEach(function (args) {
                    fn.apply(this, args);
                });
                impl = fn;
            }, false);

            return function () {
                return impl.apply(this, arguments);
            };
        };
    }])
    .factory('manaFactory', [function(){
        this.testString = function(){
          return 'This works';
        };
    }]);

这是我的routes.js

angular.module('Manalator', ['ngRoute', 'Manalator.services', 'Manalator.controllers'])
    .config(function ($routeProvider) {
        $routeProvider
            .when('/', {
                controller: 'MainCtrl',
                templateUrl: 'partials/pages/main.html'
            })
            .when('/devotion', {
                controller: 'MainCtrl',
                templateUrl: 'partials/pages/devotion.html'
            })
            .when('/results', {
                controller: 'MainCtrl',
                templateUrl: 'partials/pages/results.html'
            })
            .otherwise({redirectTo: '/'});
    });

我收到以下错误:

TypeError: Cannot read property 'testy' of undefined
    at new <anonymous> (controllers.js:3)
    at Object.i [as invoke] (main.min.js:1)
    at $get.f.instance (main.min.js:2)
    at m (main.min.js:1)
    at s (main.min.js:1)
    at $get.e (main.min.js:1)
    at main.min.js:1
    at p.$get.p.$eval (main.min.js:3)
    at p.$get.p.$apply (main.min.js:3)
    at main.min.js:1

这是一个带有基本路线的cordova手机设置。我是棱角分明的新手。我查看了互联网,我无法设置基本服务来保存我的所有数据,所以我可以从我的所有路线访问它。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:2)

您需要将服务标识为控制器的依赖项。

第一步是确保在控制器之前定义服务。

然后更改控制器代码,以便将服务命名为依赖项。

angular.module('Manalator.controllers', ['Manalator.services'])
.controller('MainCtrl', ['$scope', function ($scope, manaFactory) {
    manaFactory.testString();
}]);

希望这有帮助!