TypeScript中的角度材質示例：芯片

Question

我想在TypeScript中重新創建這裏看到的芯片示例（https://material.angularjs.org/latest/#/demo/material.components.chips），並且由於我相當新（本週開始學習它！），我有點被卡住了從Javascript重寫此爲打字稿：

JS：

function mockLabels() { 
     var labels = [ 
     { 
      'name': 'hotel', 
      'id': '1' 
     }, 
     { 
      'name': 'sport', 
      'id': '2' 
     }, 
     { 
      'name': 'gaming', 
      'id': '3' 
     }   
     ]; 
     return labels.map(function (lab) { 
     lab._lowername = lab.name.toLowerCase(); 
     return lab; 
     }); 
    } 

打字稿：

private mockLabels: Array<Label> = [ 
      new Label(1, 'hotel'), 
      new Label(2, 'sport'), 
      new Label(3, 'gaming') 
     ]; 

public getLabels() { 
      return this.mockLabels;   
     } 

正如您所看到的，我不知道如何在TypeScript代碼中將.map分配給TypeScript中的數組時將.map包含在內。

我該如何重寫mockLabels來做到這一點？

Answer 1

請注意，JavaScript是TypeScript。所以，我會做以下（基本上只是添加類型註釋）：

function mockLabels() { 
    var labels:{ 
    name: string; 
    id: string; 
    _lowername?: string; 
    }[] = [ 
    { 
     'name': 'hotel', 
     'id': '1' 
    }, 
    { 
     'name': 'sport', 
     'id': '2' 
    }, 
    { 
     'name': 'gaming', 
     'id': '3' 
    } 
    ]; 

    return labels.map(function (lab) { 
    lab._lowername = lab.name.toLowerCase(); 
    return lab; 
    }); 
} 

注意：你有veg但沒有定義的變量，我把它改成lab假設是你的意思。