Typescript - Bind ngModel to property of object

Question

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"}};

Sajeetharan · Accepted Answer · 2018-08-29 01:51:58Z

3

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.

answered Aug 29, 2018 at 1:51

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

basarat · Accepted Answer · 2018-08-29 00:10:12Z

1

Is this also possible to be done at deepter levels?

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

answered Aug 29, 2018 at 0:10

basarat

278k60 gold badges475 silver badges528 bronze badges