Get the value of ngModel in a child component

Question

If I have a parent-child component relationship in angular 2 like so:

@Component({
    selector: `child`,
    template: `
        <div>
        </div>`
})
export class ChildComponent { 
    //... 
}

@Component({
    selector: `parent`,
    template: `
        <div>
            <child [(ngModel)]="data.value"></child>
        </div>`
    directives: [ChildComponent]
})
export class ParentComponent { 
     private data = {
          value: string,
          property: number
     };
}

How would I access the ngModel in the child component? If I modified the ngModel value in the child component will it update the parent component?

Answer 1

Before RC2, you need to implement a custom validator for your child component to be able to use ngModel on it.

See this question for more details:

• Angular 2 custom form input

From RC2, things are much simpler since you can do something like that:

<form #f="ngForm">
  <custom-input name="Nan" [ngModelOptions]="{name: 'custom'}" ngModel>
</form>