I cannot find how I can access DI properties from a child class

Question

I have implemented this approach on my angular app and login/registration are working.

Now I wish to add a function to run OnInit when my custome registration/login components are initialized.

Specifically I wish to use/inject

MyService
ActivatedRoute/ActivatedRouteSnapshot to access url params on the two components.
LocationStrategy

into my child components (LoginComponent and RegistrationComponent) because they all derive from NbLoginComponent and NbRegisterComponent respectively

Here is my register.component.ts

export class NgxRegisterComponent extends NbRegisterComponent {}

Here is my NbRegisterComponent

export declare class NbRegisterComponent {

    constructor(
        service: NbAuthService, 
        options: {}, 
        cd: ChangeDetectorRef, 
        router: Router);

    register(): void;

    getConfigValue(key: string): any;

    static ɵfac: ɵngcc0.ɵɵFactoryDef<NbRegisterComponent>;

    static ɵcmp: ɵngcc0.ɵɵComponentDefWithMeta<NbRegisterComponent, "nb-register", never, {}, {}, never>;
}

I am stuck in that I cannot use Injector on NbRegisterComponent because the constructor wont accept any properties, not arguments.

Also, I tried declaring protected members in NbRegisterComponent and added it to the constructor

protected myService : MyService

Then in the child class, RegisterComponent, I added the properties to constructor's and Super()'s arguments but the injected properties were all null/undefined.

Any help would go a long way.

if you extend you should have access to the parent methods without injecting them again. Static methods don't have access to this though — user3791775, May 08 '20 at 19:41
Returns an undefined object. This seems to be a similar issue but I cannot understand it well enough. https://github.com/akveo/nebular/issues/1234 — ChampR, May 08 '20 at 20:03

ChampR · Accepted Answer · 2020-05-09T18:56:30.503

Hehehe,

In the child component I added a list of providers for all the objects/properties needed like

@Component({
  //...
  providers: [
    {provide: VisitsService, useClass : VisitsService},
  ]
})

Here after in the constructor of the child component I appended the @Inject() function as

  constructor(
    @Inject(ActivatedRoute)activateRoute : ActivatedRoute,
    @Inject(VisitsService) protected visitService: VisitsService,    
  ){
    super(
      activateRoute, 
      visitService);
  }

Now everything works.

Oh! remember the parent components also injected these properties to its constructor and the order of arguments matters.

I cannot find how I can access DI properties from a child class

1 Answers1