Question

我想在TypeScript中重新创建这里看到的芯片示例（https://material.angularjs.org/latest/#/demo/material.components.chips），因为我相当新（本周开始学习它！），我有点陷入重写这从Javascript到TypeScript：

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中的数组中。

我如何重写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，假设这是您的意思。

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

1 个答案: