有没有办法在 TypeScript 中循环自定义对象属性？

Question

所以我制作了一个如下所示的界面：

export interface MyInput {
    disabled?: boolean,
    type: 'text' | 'email' | 'password' | 'number',
    label?: string,
    placeholder?: string,
    helpText?: string
}

我正在 Angular 中制作一个组件，它根据给定的值绘制特定的输入字段。组件代码如下所示：

export class BasicInputsComponent implements OnInit{
  @Input() options: MyInput = {
    type: 'text',
  }

  ngOnInit() {
    for (const key in this.options) {
      console.log(this.options[key]);
    }
  }
}

我的 for-in 循环不工作，它给我这个错误：

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'MyInput'. No index signature with a parameter of type 'string' was found on type 'MyInput'.ts(7053)

如何动态获取对象中的键及其相对值？

Answer 1

...好吧，例如在迭代中输入 key（其他可能的方式）：

class Tester {
  options: MyInput = {
    type: 'text',
  }

  test() {
    for (const key in this.options) {
      console.log(this.options[key as keyof MyInput]);
    }
  }

 testNoTyping() { Object.entries(this.options).forEach(([key, val]) => console.log({ [key]: val })) }

}

有没有办法在 TypeScript 中循环自定义对象属性？

Is there a way to loop through custom object properties in TypeScript?

interface

typescript

angular