DRYing up an Angular2 TypeScript Class

Question

I'm relatively new to TypeScript. I have a need to implement two route guards that share a common function and state.

When I attempt to extend a injectable class with a constructor, the resulting class does not receive instances of the private members.

Contrived example:

// guard-base.ts

@Injectable()
export abstract class GuardBase {
  constructor(
    private sharedState: SharedState,
  ) {}

  sharedMethod(): boolean {. . .}
}


// authentication-required.guard.ts

@Injectable()
export class RouteGuard extends GuardBase implements CanActivate {
  canActivate(): Promise<boolean> {
    console.log(this);
    // this.sharedState equals undefined at this point
  }
}

Do I have to provide the constructor arguments in the RouteGuard class? What I would like to do is encapsulate all of the imports and the shared method on the base class. Is that possible? If not, what's the best way to accomplish what I would like to do?

ps2goat · Accepted Answer · 2017-02-07 19:52:15Z

1

Even other languages expect you to provide a new constructor for the new class (complete with parameters), then pass those parameters into the parent class's constructor to do what you're asking about. http://www.c-sharpcorner.com/UploadFile/5089e0/how-to-use-super-keyword-in-typescript/

Use super(sharedState) to pass the sharedState parameter from the child into the parent's constructor.

If you want to access a member variable from the parent class, use protected instead of private.

answered Feb 7, 2017 at 19:52

ps2goat

8,5251 gold badge39 silver badges74 bronze badges

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

3 Comments

Brandon Taylor Over a year ago

Gotcha. Hmm. I was hoping for something a bit more elegant. Will I have the same issue when extending a non-abstract class?

ps2goat Over a year ago

@Brandon- yes, this is the same for all classes, abstract or concrete.

Brandon Taylor Over a year ago

Thank you for the help. It's not quite as DRY as the Python I used to write, but it will work :)

Collectives™ on Stack Overflow

DRYing up an Angular2 TypeScript Class

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related