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>