AngularJS:如何将Controller注入服务?

时间:2016-05-02 04:28:56

标签: angularjs angularjs-scope

我想将一个控制器注入服务。

我使用AngularJs和Laravel以及glup-ng-annotate。

/* DialogController*/
    (function(){
        "use strict";

        angular.module("music.controllers").controller('DialogController', function( $scope, $mdDialog ){
            $scope.hide = function() {
                $mdDialog.hide();
            };
            $scope.cancel = function() {
                $mdDialog.cancel();
            };
            $scope.answer = function(answer) {
                $mdDialog.hide(answer);
            };
        });
    })();

这就是服务

/* Service */
(function(){
    "use strict";

    angular.module("music.services").factory('DialogService', function( $mdDialog, DialogController){

        return {
            fromTemplate: function(template, $scope ) {

                var options = {
                    controller: DialogController,
                    templateUrl: template
                };

                if ( $scope ){
                    options.scope = $scope.$new();
                }

                return $mdDialog.show(options);
            },

            alert: function(title, content){
                $mdDialog.show(
                    $mdDialog.alert()
                    .title(title)
                    .content(content)
                    .ok('Ok')
                    );
            }
        };
    });
})();

我有这个错误

错误:[$ injector:unpr]未知提供者:DialogControllerProvider< - DialogController< - DialogService

2 个答案:

答案 0 :(得分:1)

可以将服务注入控制器,但反之亦然。由于AngularJS中的依赖注入支持在控制器中注入服务。

答案 1 :(得分:1)

控制器应由$mdDialog服务注入。在名称周围加上引号,以便$mdDialog服务获取字符串而不是引用。

(function(){
    "use strict";

    angular.module("music.services")
      .factory('DialogService', function($mdDialog ̶,̶D̶i̶a̶l̶o̶g̶C̶o̶n̶t̶r̶o̶l̶l̶e̶r̶ ){

        return {
            fromTemplate: function(template, $scope ) {

                var options = {
                    //REPLACE this
                    //controller: DialogController,
                    //WITH this
                    controller: "DialogController",
                    templateUrl: template
                };

                if ( $scope ){
                    options.scope = $scope.$new();
                }

                return $mdDialog.show(options);
            },

            alert: function(title, content){
                $mdDialog.show(
                    $mdDialog.alert()
                    .title(title)
                    .content(content)
                    .ok('Ok')
                    );
            }
        };
    });
})();

在这种情况下,options对象将传递给注入控制器的$mdDialog服务。

在幕后,$mdDialog服务使用$controller Service注入指定的控制器。