Typescript interface - add new value dynamically or create the interface dynamically

Question

I have an Angular Material Table. Obviously, I have an interface from which is created the dataSource for the table. Is there any possibility to add a new value dynamically in the interface, or at least to create the interface dynamically? Because the data which is coming from the backend it's unknown.

Example: from this:

export interface PeriodicElement {
  name: string;
  position: number;
  weight: number;
  symbol: string;
}

to this:

export interface PeriodicElement {
  name: string;
  position: number;
  weight: number;
  symbol: string;
  index: number;
}

or from this:

export interface PeriodicElement {}

to this:

export interface PeriodicElement {
  name: string;
  position: number;
  weight: number;
  symbol: string;
  index: number;
}

hhhmmm If it's almost same interface but with different number of fields present, you might use DataSource<Partial<PeriodicElement>>(elements) — millenion
– millenion, Commented Sep 15, 2021 at 5:00

JsNgian · Accepted Answer · 2021-09-15 05:07:18Z

2

It will be better to use it like,

export interface PeriodicElement {
  name: string;
  position: number;
  weight: number;
  symbol: string;
  [key: string]: string | number;
}

or just

export interface PeriodicElement {
  [key: string]: string | number;
}

Otherwise you can create separate models and use union(|) operator.
Also you can use Partials to achieve this.
For creating dynamically Refer here

answered Sep 15, 2021 at 5:07

JsNgian

8356 silver badges19 bronze badges

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

Collectives™ on Stack Overflow

Typescript interface - add new value dynamically or create the interface dynamically

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related