Angular-变量中的ngModel对象属性

Question

我的应用程序中有以下用户对象：

let user = {name: "John", dob:"1995-10-15", metadata: {}}

我的对象的metadata属性是一个空对象。在用户输入时，我想在metadata对象中创建一个新属性，例如：

<input [(ngModel)]="user.metadata.childrenNumber" placeholder="Enter number of children"></input>

到目前为止，一切正常。但是，我已将childrenNumber属性存储在数组中：

let metaDataOptions = ['childrenNumber', 'workStatus', 'education'];

如何引用希望从该数组创建的属性名称？对于上述情况，我尝试执行以下操作：

// i is index from ngFor. i can be 0, 1 or 2
<input [(ngModel)]="user.metadata.metaDataOptions[i]" placeholder="Enter number of children"></input>

但是，这不起作用。如何获得想要的结果？

Answer 1

保持在物体下方。

let user = {name: "John", dob:"1995-10-15", metadata: {}}
let metaDataOptions = ['childrenNumber', 'workStatus', 'education']

您可以使用下面的代码行在元数据对象内创建对象属性。

<input [(ngModel)]="user.metadata[metaDataOptions[i]]" placeholder="Enter number of children"></input>

Answer 2

使用索引0

<input [(ngModel)]="user.metadata.metaDataOptions[0]" placeholder="Enter number of children"></input>

Answer 3

您可以随便

let user = {name: "John", dob:"1995-10-15", metadata: { 'childrenNumber' : null}}

然后

<input [(ngModel)]="user.metadata.childrenNumber" placeholder="Enter number of children"></input>