Typescript declaration issue with interface

Question

I'm trying to declare an interface to allow a FormatComponent 'dictionary' to allow for a bunch of different components to be added - all implementing the interface. This is a type lookup, not an instance, so I think I understand why I can't use the interface in Format Components below - only 'any' works. There is a compiler error indicating the type doesn't implement data - when the interface is used.

But, it would be nicer to be type safe and use the interface in the declaration of FormatComponents - any ideas how to achieve it?

export interface FormatComponent {
    data: any;
}

export class ContactFormatComponent implements FormatComponent{
    data: any;
}

export const FormatComponents: { [id: string]: any } = {
    //I want FormatComponent instead of any
    'co-contacts': ContactFormatComponent,
    'other': OtherComponent // also implements the interface
};

SLaks · Accepted Answer · 2018-03-15 21:37:39Z

3

Use the type {new(): FormatComponent} to match a class (or rather, constructor) that implements FormatComponent.

Demo

answered Mar 15, 2018 at 21:37

SLaks

891k182 gold badges1.9k silver badges2k bronze badges

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

Collectives™ on Stack Overflow

Typescript declaration issue with interface

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related