I have an object called user:

let user = {};

How can I bind an input to a undefined property? E.g.

<input [(ngModel)]="user.name" placeholder="Enter your name"></input>

And whenever the user enters his name, I want the ngModel to create the undefined property of that object and result in this:

user = {name: "John"};

Is this also possible to be done at deepter levels? E.g.

<input [(ngModel)]="user.homeaddress.postcode" placeholder="Enter your post code"></input>

to result in:

user = {name: "John", homeaddress: {postcode: "E20 1QS"}};

I have an object called user:

let user = {};

How can I bind an input to a undefined property? E.g.

<input [(ngModel)]="user.name" placeholder="Enter your name"></input>

And whenever the user enters his name, I want the ngModel to create the undefined property of that object and result in this:

user = {name: "John"};

Is this also possible to be done at deepter levels? E.g.

<input [(ngModel)]="user.homeaddress.postcode" placeholder="Enter your post code"></input>

to result in:

user = {name: "John", homeaddress: {postcode: "E20 1QS"}};

• javascript
• angular
• typescript
• undefined
• ngmodel

2 Answers 2

Two way data binding supports any nested objects, you just need to use it as,

<input [(ngModel)]="user.homeaddress.postcode" placeholder="Enter your post code"></input>

since you have initialized data it wont throw any error.

Is this also possible to be done at deepter levels?

Yes. "user.homeaddress.postcode" will work.