Anmelden/Abbestellen VS Create/TakeUntil?

Question

Ich entwickle eine Komponente in Angular2 mit RxJs. Dies ist mein erster Schritt mit RxJs und ich debattiere die Profis und den Umgang mit RxJs.

Die Komponente basiert auf einer Textbox. Wenn die Textbox passiv und nicht scharf eingestellt ist, zeigt die Textbox Informationen an. Wenn der Benutzer darauf klickt, befindet sich der Fokus auf dem Textfeld, darunter erscheint ein Tooltip, der Informationen anzeigt, während der Benutzer den Text bearbeitet.

Auf jedem KeyUp wird der Wert der Textbox verarbeitet und multiple Geschäftsregeln werden validiert. Anschließend wird das Popup aktualisiert, um dem Benutzer eine Rückmeldung zu geben.

Die Validierungen werden als Subskription eines Observablen auf dem Keyup mit debounceTime und distinctUntilChanged verarbeitet.

Es gibt zwei Ereignisse: "Bearbeitung starten", wenn der Benutzer auf das Textfeld klickt, und "Bearbeitung beenden", wenn der Benutzer ENTER, ESCAPE, TAB drückt oder außerhalb des Steuerelements klickt.

In Anbetracht der Tatsache, dass es mehr als 20 Kontrollen dieser Art auf der Webseite geben wird, welche Best Practices, um das Abonnement von keyUp zu verwalten? Beispiele:

1. Jedes Mal, „Bearbeitung starten“ ausgelöst, ein Abonnement auf keyup erstellen, wie Observable.fromEvent (‚keyup‘) und den Operator „takeUntil“ mit dem „Ende editing“ Ereignis als Parameter hinzu?
2. Halten Sie das Observable irgendwo, jedes Mal, wenn "Bearbeitung starten" ausgelöst wird, abonnieren Sie es, um die Eingabe zu verarbeiten, wenn "Bearbeitung beenden" auftritt, abbestellen?
3. Es gibt keinen signifikanten Unterschied zwischen A oder B
4. Andere Vorschläge?

Vielen Dank! Sebastien

Answer 1

Ich würde so etwas tun:

onKeyUpObservable 
    .window(
     startEditingObservable, 
     function() { return endEditingObservable; } 
    ) 
    .subscribe(keyUpEvent => { 
     // Here you will get key up events that happen between 
     // start editing and end editing... 
    }); 

Sie können here mehr auf dem window Operator lesen.