ControlValueAccessor component not updating value in formgroup at angular 7

Question

I'm using angular 7. And I created child component like below Stackblitz by ControlValueAccessor. I have a combobox and textbox in my form. And when I select item from combobox, then value of item set to textbox. But when I clicked "SAVE" button, my form value coming as empty. What can be the reason of coming as empty?

STACKBLITZ

Answer 1

You need 2 changes to make it work.

First of all your onChange() method does nothing.

Change it to public onChange: (value) => void.

Then call this.onChange(selected) on your set selectedItem(selected) after writing to the value property so it becomes

set selectedItem(selected) {
    this.value = selected;
    this.onChange(selected);
} 

See new stackblitz