angulardependency-injectionngx-adminnebula

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


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

  1. MyService
  2. ActivatedRoute/ActivatedRouteSnapshot to access url params on the two components.
  3. 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.


Solution

  • 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.