2017-10-03 4 views
7

Je suis en train de mettre en œuvre AutoSave de données de forme angulaire 4. Il devrait fonctionner comme ceci:
angulaire 4 forme prévue AutoSave

  • utilisateur modifie des données sous la forme -> une requête d'enregistrement à DB est invoquée . Supposons qu'une minuterie est démarrée ici pendant 2s.
  • Pendant les 2s de la demande de sauvegarde précédente, toutes les modifications n'appelleront aucune requête (pour réduire la charge DB), mais déclencheront une autre demande de sauvegarde, puis la temporisation 2s expirera.
  • Si aucune temporisation n'est démarrée pour le moment, la demande de sauvegarde doit être appelée immédiatement.

Je suppose que Observable, Subject et Scheduler de RxJS va me aider, mais je suis tout à fait nouveau pour elle. Pourriez-vous suggérer la meilleure approche pour réaliser la fonctionnalité ci-dessus s'il vous plaît?

Répondre

4

Vous pouvez simplement souscrire à valueChanges property on FormGroup object enchaîné avec l'opérateur auditTime:

this.form.valueChanges.auditTime(2000).subscribe(formData => /* save to DB */) 

Peut-être ont aussi un oeil à throttleTime et debounceTime opérateurs.

+0

Merci beaucoup! L'opérateur 'auditTime' est exactement ce dont j'avais besoin! Solution si simple et élégante. – aleksei

+0

Réponse associée: https://stackoverflow.com/questions/46094431/how-to-implement-auto-save-a-reactive-form-in-angular-4 – Hauke