Angular 撤销重做历史存储 | ng-hub-ui-history
Angular 撤销和重做历史存储,提供对 Signals 友好的 API、事务、限制以及响应式表单支持。
API 参考
这里是 history 的完整契约:你可以绑定、监听、投影和设置主题的一切,都集中在一处。接入你需要的部分,自定义你想要的样式——它是 standalone 的,且对 signal 友好。
输入
通过 4 个输入项精细调校 history。像绑定任意 Angular @Input 一样绑定它们。
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
createHistoryStore(config) | HistoryStoreConfig<T, K> | — | 创建一个基于 Signals 的存储,可选地设置限制以及自定义 diff/patch 函数。 |
registerObject(id, initialState)必填 | (id: K, initialState: T) => void | — | 注册对象的基础状态,并为该键启动线性历史记录。 |
commit(id, newState, options?)必填 | (id: K, state: T, options?: { label?: string }) => boolean | — | 存储 diff 补丁;若指针不在末尾,则使重做分支失效。 |
watchForm(id, form, options?) | (id: K, form: FormGroup, options?: WatchFormOptions) => () => void | — | 自动提交表单值的变化,并返回取消订阅的回调。 |
输出
响应 history 的行为——有 1 个事件可供你挂接逻辑。
| 名称 | 类型 | 描述 |
|---|---|---|
states | Signal<Map<K, T>> | 响应式 signal 映射,按对象 id 保存当前的不可变快照。 |
方法
通过代码驱动 history——其编程接口提供 16 个方法。
| 名称 | 签名 | 返回值 | 描述 |
|---|---|---|---|
createHistoryStore | createHistoryStore<T, K>(config?: HistoryStoreConfig<T, K>): HistoryStore<T, K> | HistoryStore<T, K> | 创建基于 signal 的历史存储的工厂函数,可按 id 跟踪多个对象。接受可选的保留上限(maxEntries,默认 100;maxBytes,默认 512000)、一个 keySelector,以及自定义的 diff/patch 策略。 |
HistoryStore.states | states: Signal<Map<K, T>> | Signal<Map<K, T>> | 计算型 signal,以映射形式暴露以对象 id 为键的当前不可变状态快照。 |
HistoryStore.registerObject | registerObject(id: K, initialState: T): void | — | 以初始状态注册一个被跟踪对象,并为该 id 开启一条全新的空历史时间线。 |
HistoryStore.registerFromObject | registerFromObject(initialState: T): K | K | 注册一个被跟踪对象,其 id 由所配置的 keySelector 派生,并返回该 id。未配置 keySelector 时抛出异常。 |
HistoryStore.commit | commit(id: K, newState: T, options?: HistoryCommitOptions): boolean | boolean | 为已注册的 id 提交一个新的状态快照,存储正向与反向补丁,并丢弃指针之后的所有 redo 条目。当新状态未产生任何变化时返回 false。在已开启的事务内,它只更新当前状态而不创建条目。 |
HistoryStore.commitFromObject | commitFromObject(newState: T, options?: HistoryCommitOptions): boolean | boolean | 提交一个新状态,其 id 由所配置的 keySelector 派生。未配置 keySelector 时抛出异常。 |
HistoryStore.undo | undo(id: K): boolean | boolean | 通过应用条目的反向补丁回退一步历史。没有可撤销的内容时返回 false。 |
HistoryStore.redo | redo(id: K): boolean | boolean | 通过应用条目的正向补丁重做一步历史。没有可重做的内容时返回 false。 |
HistoryStore.canUndo | canUndo(id: K): boolean | boolean | 返回给定对象 id 当前是否可以执行 undo。 |
HistoryStore.canRedo | canRedo(id: K): boolean | boolean | 返回给定对象 id 当前是否可以执行 redo。 |
HistoryStore.getState | getState(id: K): T | undefined | T | undefined | 返回给定 id 当前状态的深拷贝;当该 id 未注册时返回 undefined。 |
HistoryStore.history | history(id: K): HistoryMetadata | HistoryMetadata | 返回该对象历史的只读元数据:指针、条目数量、近似保留字节数,以及每个条目的标签、时间戳和字节数。 |
HistoryStore.beginTransaction | beginTransaction(id: K, label?: string): void | — | 开启一个事务,使后续的 commit 折叠为单个合并的历史条目。当该 id 已有事务处于开启状态时抛出异常。 |
HistoryStore.endTransaction | endTransaction(id: K): boolean | boolean | 结束已开启的事务,从事务起始状态到当前状态提交一个合并条目。当没有开启的事务或没有任何更改时返回 false。 |
HistoryStore.watchForm | watchForm(id: K, form: FormGroup, options?: WatchFormOptions): () => void | () => void | 订阅 FormGroup 的 valueChanges 并自动提交每次发出的值,可选择跳过首次发出。返回一个取消订阅的回调。 |
HistoryStore.clearHistory | clearHistory(id: K): void | — | 清除给定 id 的所有历史条目,保留当前状态作为新的基础快照,并丢弃任何已开启的事务。 |
模板
尚未记录任何模板。