interview community logo

How to define two ways data binding in Angular
1 answer

we all know that ngModel of the input do two way data binding, where when you change the value in the component it's reflected to the user, and when the user change the value it's reflected in the component

but how to define two way data binding in our own component?

Angular Robert Isaac asked 1 year ago


it can be defined in the child component ts like that

@Input()  name?: number;
@Output() nameChange = new EventEmitter<number>();

where the name of the Output must match the name of the input followed by Change

then it can be easily used in any component like that <app-child-selector [(name)]="value"/>

now whenever size is emitted in the child it will be automatically updated in the parent

and whenever the value changed in the parent it will be automatically in the child

Robert Isaac answered 1 year ago loading comments...