如何描述具有動態名稱的打字稿中的類型？

Question

我想描述的是具有以下行爲

export class myData { 
    key   : string; 
    display_name : string; 
} 

但是我想有動態名key和display_name與實際鍵和DISPLAY_NAME我提供

如一個類型。以下將是有效的myData型

mySample1:myData = 
{ 
    myKey : 'myKeyValue' 
    myName : 'myNameValue' 
} 

mySample1:myData = 
{ 
    myKey2 : 'myKeyValue2' 
    myName2 : 'myNameValue2' 
} 

這樣做的動機是，我有很多從API返回的對象具有相同數目的關鍵，併爲每個鍵相同類型的值的列表數據。但問題是每個數據都有不同的鍵名。

我想在angular2中創建一個Component，它只接收具有一定數量的鍵的對象列表，並且每個鍵的值必須是某種類型。

例如，我不希望我的Component採取

var test = 
{ 
    myKey2 : 1 
    myName2 : 'myNameValue2' 
} 

或

var test2 = 
{ 
    myKey2 : 'myNameValue1' 
    myName2 : 'myNameValue2' 
    mySomeOtherKey : 'myNameValue10' 
} 

這是可能的打字稿？如果可能的話，這是打字稿的好主意嗎？

Answer 1

例如，以下將是有效的myData類型

TypeScript是結構性的。既然你想這兩個是有效：

mySample1:myData = 
{ 
    myKey : 'myKeyValue' 
    myName : 'myNameValue' 
} 

mySample1:myData = 
{ 
    myKey2 : 'myKeyValue2' 
    myName2 : 'myNameValue2' 
} 

您可以輕鬆地聲明myData是一個聯合這兩類：

type MyData = { 
    myKey: string; 
    myName: string; 
} 
    | { 
     myKey2: string; 
     myName2: string; 
    } 

let mySample1: MyData = 
    { 
     myKey: 'myKeyValue', 
     myName: 'myNameValue' 
    } 

mySample1 = 
    { 
     myKey2: 'myKeyValue2', 
     myName2: 'myNameValue2' 
    }