Angular: Dependency Injection with prototypal inheritance

Question

According to Todd Motto's styleguide, Controllers chapter:

Inheritance: Use prototypal inheritance when extending controller classes

I try to implement it in my controllers:

function BaseController(){
    'use strict';

    this._path = '';
    this._restService = undefined;
}

/**
 * Boring JSDocs
 */
BaseController.prototype.getById = function(id) {
    return this._restService.getById(this._path, id);
};

TagModalController.prototype = Object.create(BaseController.prototype);

/**
 * Even more boring JSDocs
 */
function TagModalController(CommunicationService, $modalInstance, mode, 
    id, CommandService) {
    'use strict';

    // boring assertions

    this.setPath('tags');
    this.setRestService(CommunicationService);

But, as you can see, I have to always set restService which is needed in BaseController for communication with server side. Is any possibility to inject it like CommunicationService is injected into TagModalController? Then my code will look like this:

function BaseController(CommunicationService){
    'use strict';

    this._path = '';
    this._restService = CommunicationService;
}

And method this.setRestService(CommunicationService); won't be needed anymore. Is there any way to achieve Angular DI with prototypal inheritance for controllers in AngularJS? Thank you in advance for every answer.

Estus Flask · Accepted Answer · 2015-10-11 14:07:58Z

1

This can be considered a necessary evil. Even with ES2015 classes the arguments for parent class constructor have to be specified explicitly with super.

You may want to borrow the pattern that classes use for inheritance and do

angular.bind(this, BaseController)(CommunicationService, ...);

to pass variables to BaseController constructor, especially if there is more than one dependency that should be passed there.

BaseController isn't instantiated by $controller and thus doesn't benefit from Angular DI, this is the only thing that associates BaseController with children. In order to give it an access to TagModalController injected dependencies, they have to be assigned as this properties and thus exposed to scope (Angular controllers weren't designed with this in mind, and controllerAs is just syntactic sugar to remedy $scope drawbacks). Which is not a very good thing.

edited Oct 11, 2015 at 14:07

answered Oct 11, 2015 at 14:02

Estus Flask

226k79 gold badges478 silver badges620 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular: Dependency Injection with prototypal inheritance

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related