Hello, I am currently working on implementing strictTemplate in my Angular codebase and encountering some challenges while defining the types for my models.
Below are the models I have:
export class User {
public 'name'!: Filter<string>;
public 'email'!: Filter<string>;
public 'age':!: Filter<number>
}
export class Engine {
public 'weight'!: Filter<number>;
public 'isRunning'!: Filter<boolean>;
}
export class Filter<T> {
public 'value'!: T;
public 'isSortedAscending'?: boolean;
}
This is the component where either Engine or User will be passed as input:
@Component(
selector: 'app-table',
templateUrl: './table.component.html',
)
export class TableComponent
{
@Input()
public sort: TableSortModel
....Omitted details for simplicity
}
export class TableSortModel {
[key: string]: Filter<unknown>;
}
Please note that besides Engine and User, there are other models being passed in my application, all with properties defined to use the Filter type.
The errors I'm encountering are:
Type 'Engine' is not assignable to type 'TableSortModel'. Index signature is missing in type 'Engine'.
Type 'User' is not assignable to type 'TableSortModel'. Index signature is missing in type 'User'.
I believe the index signature refers to [key: string]: Filter.
My question is, how should I define my TableSortModel so that it can accept both Engine and User classes?