Angular 如何将*ngFor与实现自定义接口的对象一起使用

我在类中有一个对象，它实现了一个接口

interface likertObj {
    1: string | number,
    2: string | number,
    3: string | number,
    4: string | number,
    5: string | number
}

export class LikertValues {
    points: likertObj = {
        1: 'positiveStrong',
        2: 'positive',
        3: 'neutral',
        4: 'negative',
        5: 'negativeStrong'
    }
}

在我的组件中，我创建了这个类的一个实例

  likertValues = new LikertValues();

。。。并尝试在我的组件模板中循环其属性

<ul>
    <li *ngFor="let likertPoint of likertValues.points | keyvalue">
        {{likertPoint.value}}
    </li>
</ul>

到

我所尝试的：

通过接口对象扩展我的接口likertObj，这会导致相同的错误

通过接口映射扩展我的接口likertObj，结果intellisense告诉我类likertObj的对象点是值

缺少类型“likertObj”中的以下属性：清除， delete、forEach、get和其他8个.ts（2740）

现在，我认为必须有一个更简单的解决方案，使对象既实现自定义接口，又具有可移植性

---

（我不想在这个问题上浪费太多的代码，所以我不想在这里添加构建配置或其他，如果能够回答这个问题，我将编辑这篇文章。）

问题来自角度管道

keyvalue

。这是你的电话号码

如您所见，管道需要：

{[key:string]：V}| Map

。对象或贴图

因此，最简单的解决方案是转换好的类型

*ngFor="let likertPoint of points | keyvalue"

与：

get points(): {[key: string]: string} {
   return this.likertValues.points as {[key: string]: string} || {}
}

如果仍有问题，请尝试：

return (this.likertValues.points as unknow as {[key: string]: string}) || {}

---

问题来自角度管道

keyvalue

。这是你的电话号码

如您所见，管道需要：

{[key:string]：V}| Map

。对象或贴图

因此，最简单的解决方案是转换好的类型

*ngFor="let likertPoint of points | keyvalue"

与：

get points(): {[key: string]: string} {
   return this.likertValues.points as {[key: string]: string} || {}
}

如果仍有问题，请尝试：

return (this.likertValues.points as unknow as {[key: string]: string}) || {}