Angular ng6：在html中动态形成变量名 组成部分

在我的组件中，我有这样的变量

i18 = 'server';
i19 = 'database';
i21 = 'share-alt';
i20 = 'battery-full';
i22 = 'soundcloud';

html 这将显示来自组件的var

i18

<fa [name]="[i18]"></fa>

<fa [name]="i18"></fa>

这将解析为“i18”而不是“服务器”

问题

---

在最后一个代码片段中，我试图从带有

'I'+category.id

的组件中获取

i18

的值，其中

category.id

为“18”，它将打印模板中的“i18”。如何编写HTML，使

'I'+category.id

的值为“server”

您无法在模板中动态创建变量名。您可以将值存储在

Map

结构中：

public names = new Map<number,string>([
  [18, "server"],
  [19, "database"],
  [20, "battery-full"],
  [21, "share-alt"],
  [22, "soundcloud"],
]);

---

请参阅以获取演示。

请提供处理这些内容的html部分，以便我们可以查看您的结构

public names = new Map<number,string>([
  [18, "server"],
  [19, "database"],
  [20, "battery-full"],
  [21, "share-alt"],
  [22, "soundcloud"],
]);

<fa [name]="names.get(category.id)"></fa>