typescript - Error while try to bind an object to a template with ngModel? -

this should easy thing, cant figure out goes wrong.

i have in class:

interface message {   type:  string;   email: string; }  export class myclass {   public message: message;   public email: string;    constructor() { }    // ... } 

if bind email variable works ([(ngmodel)]='email') if try bind message [(ngmodel)]='message.email' got error: cannot read property 'email' of undefined. why cant angular reach object variable?

you need instantiate message property able bind input on 1 of properties:

export class myclass {   public message: message = { type: '...', email: '...'};   public email: string;    constructor() { }    // ... } 

edit

in case, message interface can't use instantiate object of type. need use literal object expression instantiate object of type message. typescript check literal object has required elements.

if want instantiate type, need create class. interfaces have no correspondance in compiled code, classes have.

here sample:

export class message {   constructor(public type: string, public email: string) {   } }  export class myclass {   public message: message = new message('type', 'email');   public email: string;    constructor() { }    // ... }