outputFromObservable — an Observable as a component output

Pattern

A search component should emit "search changed" events to the parent. Not every keystroke — cleaned, debounced values. outputFromObservable(search$) is an output that takes values from a ready-made stream itself.

The problem it solves

Without this bridge the component has to keep @Output() search = new EventEmitter(), debounce by hand in the keyup handler or via an ngOnInit subscription with emitter.emit() inside. It becomes a mess: UI logic, debounce, and emit mixed in one method.

Operators and why they matter

• Subject — the component's input changes (or a form control's valueChanges).
• debounceTime — wait for a pause in typing.
• distinctUntilChanged — ignore a repeat of the same value.
• map — build the payload for the parent.

Gotchas

• Debounce first → then emit. Put debounce after the emitter and the parent already gets the noise.
• switchMap for an HTTP search belongs inside the parent or a service, not in the component's output stream.
• The output stream must not error — that would break the parent. Handle internal validation before the output.