How to inject in a parent class in Aurelia?

Question

I have a parent class where I want to inject some modules, then I have some derived classes where I would like to use these injected modules. However in the derived class you have to call super() without parameters, so injected modules in parent class are undefined. How could this be done?

import {inject} from 'aurelia-framework';
import {HttpClient} from 'aurelia-http-client';

@inject (HttpClient)
export class Parent{
   constructor(module){
       //this constructor is called from derived class without parameters,
       //so 'module' is undefined !!
       this.injectedmodule = module;
   }
}


export class ClassA extends Parent{
    constructor(){
       super();
       this.injectedmodule.get()  // injectedmodule is null !!!   
    }
}

Teachin

Answer 1

Well, just found the solution, module is actually injected in derived class and passed to parent through super() call:

import {inject} from 'aurelia-framework';
import {HttpClient} from 'aurelia-http-client';

@inject (HttpClient)
export class Parent{
    constructor(module){
       this.injectedmodule = module;
    }
}


export class ClassA extends Parent{
    constructor(module){
       super(module);
       this.injectedmodule.get()  // ok !!!   
    }
}

Teachin

removed comment, moved to answer. – Arlyn

What if you need to inject something into ClassA, will the ClassA inject come before or after the parent inject? – Nydia

Answer 2

The general recommendation is to avoid inheritance if at all possible. Utilize composition instead. In this instance:

import {inject} from 'aurelia-framework';
import {HttpClient} from 'aurelia-http-client';

@inject (HttpClient)
export class Parent{
    constructor(module){
       this.injectedmodule = module;
    }
}

@inject(Parent)
export class ClassA {
    constructor(parent){
       this.parent = parent;
       this.parent.injectedmodule.get()  // ok !!!   
    }
}

Arlyn

why avoid inheritance? – Proceleusmatic

@MatthewJamesDavis there many reasons to avoid deep inheritance hierarchies. However, implementing multiple interfaces, which can be accomplished through composition and delegation is not problematic. The issues arise from assumptions about behavior which are difficult to maintain, and impossible to document at the type level in most languages. This grows more troublesome as the depth of the hierarchy increases. There are many other reasons to avoid excessive inheritance. – Ctenophore

Answer 3

There's a web site that explain, for me, a beautiful way to do that https://ilikekillnerds.com/2016/11/injection-inheritance-aurelia/

Here's the example:

import {inject} from 'aurelia-framework';
import {Router} from 'aurelia-router';

@inject(Router)
export class Parent {
    constructor(router) {
        this.router = router;
    }
}


import {Parent} from './parent';

export class Child extends Parent {
    constructor(...rest) {
        super(...rest);
    }
}

Frontolysis