如何在下拉列表中显示枚举文本值？

54 浏览
0 Comments

如何在下拉列表中显示枚举文本值？

这是我的枚举值:\n

export enum TaskCategory {
    Task = 0,
    Bug = 1,
}

\nhtml部分:\n





     *任务类别不能为空

\n[这是控制台输出.. 请查看](https://i.stack.imgur.com/FBbaN.png)\n我只想显示枚举的文本值？\n如何在后端获取所选的选项？

0

1 答案

0 Comments

问题的原因是如何在下拉菜单中显示枚举的文本值。为了解决这个问题，可以按照以下步骤进行操作：

1. 在模板中使用枚举，可以这样做：

taskCategories: typeof TaskCategory = TaskCategory;

2. 对于数字枚举，需要过滤掉数字值：

categoryKeys: string[] = Object.keys(this.taskCategories).filter(
  key => !isNaN(Number(this.taskCategories[key]))
);

3. 如果要将选择的选项发送到后端，需要使用HttpClient。通常的做法是在一个服务中导入它并进行类似的操作：

sendData(payload) {
  return this.http.post(this.url, payload);
}

4. 然后在组件中使用：

// Todo: bind to a button
sendData() {
  this.appService.sendData(this.selectedCategory).subscribe(res => {
    // handle response
  });
}

推荐在这里阅读更多相关信息：https://angular.io/guide/http

你可以在这里查看一个工作示例：Working example

0