Angular 用于在字典上循环的工具

我有一个C#API，它为

的

返回一个

字典

在Angular中，它成为我为
制作的组件中的一个类变量，如下所示：

options: { [id: string]: string };

（这是一个猜测——我应该使用其他类型吗？）

我如何循环这个来生成
标记

这不管用

<option ngFor="let o of options | keyvalue" [value]="o.key" [selected]="value === o.key"> {{ o.value }}</option>

您可以从@angular/common使用KeyValue接口，并将数据加载到其中

组件技术

options: KeyValue<string, string>[] = [
    {
        key: "first",
        value: "blue"
    },
    {
        key: "second",
        value: "green"
    },
    {
        key: "third",
        value: "yellow"
    }
];

选项：KeyValue[]=[
{
键：“第一”，
值：“蓝色”
},
{
键：“第二”，
价值：“绿色”
},
{
关键：“第三”，
值：“黄色”
}
];

component.html

<select>
    <option *ngFor="let option of options" [value]="option.key" [selected]="value === option.key">
        {{ option.value}}
    </option>
</select>


{{option.value}}

在html文件中，键和值应该是返回的选项字典上的任何属性名称（区分大小写）。
请提供堆栈Blitz我不确定如何检索选项，但可能需要使用
async
等待响应解析：
*ngFor=“let o of options | async | keyvalue”
您的
ngFor
缺少星号。那是打字错误吗？
<select>
    <option *ngFor="let option of options" [value]="option.key" [selected]="value === option.key">
        {{ option.value}}
    </option>
</select>