在角度分量中指定通用變量的類型

Question

我正在嘗試創建一個通用組件，它只能期望兩種類型的數據：

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

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

兩種類型 X,Y 都有兩個共同的屬性，而 X 有一個額外的屬性。 現在我以這種方式定義類型：

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....>>
    }
}

以這種方式從父組件調用它：

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

這工作正常，但我不確定這個<T extends X | Y> <T extends X | Y>是執行此操作或不執行此操作的正確方法。 有人可以在這里建議最好的方法嗎？ 我們可以寫一些類似where T implements X | Y嗎？ where T implements X | Y在打字稿中？

或者我應該只使用@Input() data: any[]; ?

Answer 1

我認為這很好，但我會做T extends Y只是因為type鍵在 X 上是額外的，如果我們向它提供 Y 類型數組的輸入並且組件與type鍵混淆，則該組件會損壞。

Answer 2

我認為 Angular 框架在實例化MyComponent時不會知道通用參數 T 。 我唯一能想到的是在運行時獲取組件的實例並嘗試自己設置泛型類型，這將產生任何差異，因為MyComponent已經實例化並且@Input() data將被設置。

我認為你應該只寫@Input() data: X[] | Y[] @Input() data: X[] | Y[] 。