将对象的键值对作为单独的参数传递给 Angular 中的组件

Question

假设我有一个需要三个输入的组件

input1

、

input2

和

input3

export class testComponent {
  @Input() input1:string;
  @Input() input2:string;
  @Input() input3:string;
  ....
  ...
}

在父组件中我有类似的对象

args = {
    input1: "string1",
    input2: "string2",
    input3: "string3"
}

将对象中的这些键值对作为参数传递给

testComponent

的最佳方法是什么。

testComponent

的所有输入都不是强制性的，并且

args

有时可能没有所有参数。

我不希望

testComponent

将对象本身作为输入。请提出一些想法。谢谢你。

Answer 1

你必须手动完成，这是角度的限制，就像我们无法解构对象一样，子组件将像 React 那样读取值！

<app-test [input1]="args.input1" [input2]="args.input2" [input3]="args.input3"/>