angular2 pass ngModel to a child component

angular angular2-components angular2-ngmodel
Ibraheem Al-Saady picture Ibraheem Al-Saady · Dec 27, 2016 · Viewed 22.4k times · Source

I have ParentComponent and a ChildComponent, and I need to pass the ngModel in ParentComponent to ChildComponent.

// the below is in ParentComponent template
<child-component [(ngModel)]="valueInParentComponent"></child-component>

how can I get the value of ngModel in ChildComponent and manipulate it?

Answer

Amit picture Amit · Dec 28, 2016

You need to implement ControlValueAccessor in the child class. It's what defines your component as "having a value" that can be bound to using the angular way.

Read more about it here: http://blog.thoughtram.io/angular/2016/07/27/custom-form-controls-in-angular-2.html

Related questions

How to call another components function in angular2

I have two components as follows and I want to call a function from another component. Both components are included in the third parent component using directive. Component 1: @component( selector:'com1' ) export class com1{ function1(){...} } Component 2: @component( selector:'com2…

Read More
Angular - What is the meanings of module.id in component?

In an Angular app, I have seen that @Component has property moduleId. What does it mean? And when module.id is not defined anywhere, the app still works. How can it still work? @Component({ moduleId: module.id, selector: 'ng-app', templateUrl: …

Read More
Pass variable to custom component

I have my custom component: @Component({ selector: 'my-custom-component', templateUrl: './my-custom-component.html', styleUrls: ['./my-custom-component.css'] }) export class MyCustomComponent { constructor() { console.log('myCustomComponent'); } } I can use it like this: <my-custom-component></my-custom-component> But how I can pass …

Read More