CODEWITHSUNDEEP
angularjsangularjs-scope
Boris Dehoumon
Boris Dehoumon

Reputation: 37

AngularJS : How to inject Controller into Service?

I want to inject One Controller to Service.

I use AngularJs and Laravel and 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);
            };
        });
    })();

And this is Service

/* 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')
                    );
            }
        };
    });
})();

I have this error

Error: [$injector:unpr] Unknown provider: DialogControllerProvider <- DialogController <- DialogService

Upvotes: 3

Views: 2971

Answers (2)

georgeawg
georgeawg

Reputation: 48968

The controller should be injected by the $mdDialog service. Put quotes around the name, so that the $mdDialog service gets a string instead of a reference.

(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')
                    );
            }
        };
    });
})();

In this case the options object is passed to the $mdDialog service which does the injection of the controller.

Under the hood, the $mdDialog service uses the $controller Service to inject the specified controller.

Upvotes: 2

Prasheel
Prasheel

Reputation: 1020

A service can be injected into a controller but the vice-versa is not possible. As the dependency injection in AngularJS supports injection of services in controllers.

Upvotes: 2

Related Questions