How to destroy reactive FormControl on Component destroy?

I have a component with FormControl and subscription on it's value change:

@Component(...)
export class FooComponent implements OnInit, OnDestroy {
fooFormControl: FormControl;

...

ngOnInit() {
this.fooFormControl.valueChanges.subscribe(
() => {...},
() => {},
() => {
// never happens
},
);
}

ngOnDestroy() {
//happens
}
}


But when component is destroyed FormControl element isn't destroyed and onComplete callback never happens.

What is the right way to destroy FormControl element on component destroy?

Continue reading...