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

Вы можете просто позволить этому быть

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

а потом

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

Answer 3

Использовать индекс 0

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