如何在Angular中使用ID名称从数组中获取值？答案

【问题标题】：How to get a value from an array using ID name in Angular?如何在Angular中使用ID名称从数组中获取值？
【发布时间】：2022-01-21 15:49:13
【问题描述】：

我正在从 API graduated 获取值，我想从下面的数组中打印原始文本。

API 响应

当前结果如下图

.ts 文件

 levelEducation = [
    {id: "not-graduated", name: "OTHERS.NotGraduated"},
    {id: "graduated", name: "OTHERS.Graduation"},
    {id: "master", name: "OTHERS.Master"},
    {id: "doctorate", name: "OTHERS.Doctorate"},
  ];

HTML 文件代码

 <div class="form-field">
     <label>{{'JOBAPPLICATION.LevelOfEducation' | translate}}</label>
     <h5>{{userData.livello_studi ? userData.livello_studi : '-'}}</h5>
     <h5 *ngFor="let item of levelEducation">{{(item.name ? item.name : '-' ) | translate}}</h5>
 </div>

所以我需要在角度使用 ID 名称 graduated 来评估“OTHERS.Graduation”。

【问题讨论】：

我真的不知道预期的行为是什么。您想将渐变映射到毕业吗？您可以使用硬编码映射来做到这一点。不太确定“其他”是什么。应该做。我在这里有点困惑。也许你有一些澄清:)
“其他”。用于多语言，所以现在考虑作为一个简单的文本。
这个问题更多是关于如何在你的前端翻译不同的文本吗？就像你有一个法国前端，一个波兰人等？

标签： javascript html angular typescript

【解决方案1】：

最好的选择是使用livello_studi 值和您想要的显示值之间的映射。

我猜OTHERS 是一个枚举，所以首先你需要定义地图数据。

levelEducation = new Map([
  ["not-graduated", OTHERS.NotGraduated],
  ["graduated", OTHERS.Graduation],
  ["master", OTHERS.Master],
  ["doctorate", OTHERS.Doctorate],
]);

要从地图中获取数据，您可以这样做

levelEducation.get(userData.livello_studi); // this will return undefined if the item is not found

所以你可以在模板中这样做来获取数据：

<h5>{{levelEducation.get(userData.livello_studi) || '-'}}</h5>

（或将此代码移动到函数中以保持清洁）

【讨论】：

【解决方案2】：

如果您想将数值从graduation 映射到Graduation，您可以使用映射来解决这个问题。假设您有 n 个值并且这不是可编辑的输入。

let map = new Map();
map.set("graduated" ","Graduation");
map.set("not-graduated","Not graduated");

....

稍后当您需要显示您的值时，您可以编写一个函数，在需要时显示您的可显示文本。

return map.get("graduated");

【讨论】：