CODEWITHSUNDEEP
angular
Jose
Jose

Reputation: 1819

Update value from a parent and child component. Bidirectional. Angular 5.2.0

I have created a component that I reuse in others.

It's an autocomplete, and when you select a value I send it to the parent component

// child component

empleado: Empleado;
@Output() empleadoEvent = new EventEmitter<Empleado>();
....
onSelect() {
    this.empleadoEvent.emit(this.empleado);
}

// view parent

<jhi-empleado-autocomplete (empleadoEvent)="receiveEmpleado($event)"></jhi-empleado-autocomplete>

// controller parent

receiveEmpleado($event) {
    this.empleado = $event
}

When I make a change in the son, the new value reaches the father. But if I want to erase the value of the child from the father I do not know.

Not even if you can put an attribute in the parent and child and if they change aside that change is reflected in the other, whether the change in the child as the parent.

Upvotes: 0

Views: 678

Answers (2)

Vikas
Vikas

Reputation: 12036

you use @ViewChild()decorator to access the properties and methods of child component. parent.component

    @ViewChild(ChildComponent)
        private childComponent: ChildComponent;

    receiveEmpleado($event) {
        this.empleado = $event
    }

yourMethod() {
       this.childComponent.someproperty=null
    }

Upvotes: 1

Ishant Gaurav
Ishant Gaurav

Reputation: 1203

You can sue the @ViewChild in the parent, then get the reference of the child component value .......then apply ngOnChanges in the child component and change the value accordingly.

Upvotes: 0

Related Questions