在角度分量中指定通用变量的类型

Question

I am trying to create a generic component which can expect data of two types only:

interface X{
    name: string,
    path: string,
    type: string,
}

interface Y{
    name: string,
    path: string,
}

Both types X,Y have two common properties and X has one extra. Now I am defining the type this way:

export class MyComponent<T extends X | Y> implements OnInit{
    @Input() data: T[];
    func(item: T){
        let temp = this.data.find(x => x.name === item.name);
        <<....some code....>>
    }
}

Calling this from the parent component this way:

<my-component [data]="xList"></my-component>     <!-- xList: X[] -->
<my-component [data]="yList"></my-component>     <!-- yList: y[] -->

This is working fine but I am not sure if this <T extends X | Y> <T extends X | Y> is the correct way to do this or not. Can anybody please suggest the best approach here? Can we write something like where T implements X | Y where T implements X | Y in Typescript?

Or should I just use @Input() data: any[]; ?

Answer 1

我认为这很好，但我会做T extends Y只是因为type键在 X 上是额外的，如果我们向它提供 Y 类型数组的输入并且组件与type键混淆，则该组件会损坏。

Answer 2

I don't think the Angular framework would know the generic argument T when it instantiate MyComponent . the only thing i can think of is to get an instance of the component at runtime and try to set the generic type yourself which will make any diffrence as the MyComponent would be instanciated already and the @Input() data would be set.

I think you should just write @Input() data: X[] | Y[] @Input() data: X[] | Y[] .