Angular Undo-Redo-History-Store | ng-hub-ui-history

Angular Undo- und Redo-History-Store mit Signals-freundlichen APIs, Transaktionen, Limits und Unterstützung für Reactive Forms.

Zuletzt aktualisiert 08.08.2026

Übersicht

Warum Teams nach dieser Bibliothek suchen

Nutze diesen Angular History-Store, wenn du Undo und Redo für komplexen State brauchst, ohne eine vollständige externe State-Bibliothek einzuführen.

Installieren

npm install ng-hub-ui-history

Springen zu

Ideal für

  • Editoren
  • Formular-Builder
  • Low-Code-Tools
  • Konfigurationsoberflächen

Über history

ng-hub-ui-history ist besonders nützlich in Angular-Editoren, Formular-Buildern und Konfigurationsbildschirmen, in denen der Benutzer erwartet, sicher zurückgehen zu können. Es bringt Undo- und Redo-Muster in zustandsbehaftete Workflows, ohne dich zu einer schwergewichtigen Architekturentscheidung zu zwingen.

Funktionsleitfäden

Manuelle Commits und Zeitreise

Verfolgen Sie Zustandsänderungen und reisen Sie vorwärts/rückwärts durch die lineare History.

Beispiele:
Basic History

Manual commit, undo and redo.

{
  "title": "Getting Started with History",
  "description": "Edit and commit to create undo/redo entries."
}

Verschachtelte Objekte und Arrays

Verwenden Sie patch-basiertes Tracking für tiefe Objektgraphen und Listenmutationen.

Beispiele:
Nested Object History

Nested properties and dynamic list updates.

{
  "id": "invoice-1",
  "customer": {
    "name": "Acme Corp",
    "city": "Madrid"
  },
  "lines": [
    {
      "name": "Support plan",
      "quantity": 1,
      "unitPrice": 150
    }
  ]
}

Automatisches Formular-Tracking

Committen Sie Formularwertänderungen automatisch mit integrierten Watch-Helpern.

Beispiele:
Reactive Form Watch

watchForm() for automatic commits from FormGroup.

{
  "name": "Maria",
  "email": "maria@demo.local",
  "role": "Editor"
}

Transaktionen und Aufbewahrung

Gruppieren Sie mehrere Operationen in einem Eintrag und kürzen Sie alte Einträge gemäß den konfigurierten Limits.

Beispiele:
Transactions + Limits

Consolidated commits and FIFO retention.

Pointer: -1 / Entries: 0 / Bytes: 0 

{
  "id": "transaction-editor",
  "title": "Release notes draft",
  "content": "Initial draft content.",
  "tags": [
    "draft"
  ]
}

Hauptfunktionen

Letzte Änderungen

Version 22.0.2 - 8/8/26, 12:00 AM

fixed: Documentation links now point at the canonical localized URLs. The README linked to https://hubui.dev/<path> with no locale prefix and no trailing slash, and both forms are 301-redirected, so every reader arriving from npm or GitHub landed on a redirect instead of the canonical page.

Version 22.0.1 - 7/28/26, 12:00 AM

added: Test suite for the diff/patch/clone utilities and multi-object undo/redo: cloneDeep isolation (nested structures, Dates), createDefaultDiff/applyDefaultPatch round-trips across representative shapes (nested objects, array insert/remove/reorder, key deletion, null transitions, deep nesting), estimateBytes sanity, and store-level coverage for independent per-object timelines, no-op transactions and redo invalidation after transactional commits. No runtime changes.

Version 22.0.0 - 6/17/26, 12:00 AM

changed: Aligned with Angular 22.

changed: README documentation standardized.

Version 0.1.0 - 2/23/26, 12:00 AM

added: Initial release with multi-object linear history.

added: Undo/redo, transactions, and maxEntries/maxBytes retention limits.

added: Reactive Forms auto-commit integration via watchForm().

Verwandte Bibliotheken

ng-hub-ui-sortable ng-hub-ui-utils ng-hub-ui-paginable