译零 TransZero · TanStack Query 中文文档
主站

injectMutationState

更新于 2026-11-02 Angular 查看英文原文 ↗
TypeScript
1function injectMutationState<TResult = MutationState<unknown, Error, unknown, unknown>>(injectMutationStateFn?: () => MutationStateOptions<TResult>, options?: InjectMutationStateOptions): Signal<TResult[]>;

定义于:packages/angular-query-experimental/src/inject-mutation-state.ts:114

注入一个信号,使你能够访问 MutationCache 中的所有修改(mutations)。你可以传入 filters(MutationFilters)来筛选目标修改,并传入 select 来转换修改状态。

类型参数

TResult

TResult = MutationState<unknown, Error, unknown, unknown>

参数

injectMutationStateFn?

() => MutationStateOptions<TResult>

一个返回 filters 以筛选匹配的修改、并可选返回 select 以转换修改状态的函数。该函数与 Angular 的 computed 类似,运行于响应式上下文中,因此在其中读取的信号会动态重新筛选匹配的修改。

options?

InjectMutationStateOptions

额外配置

options 属性

属性 类型 描述
injector? Injector 创建修改状态信号所用的 Injector。若未提供此选项,则使用当前注入上下文(通过 inject 获取)。

返回值

Signal<TResult[]>

一个信号,其值为一个数组,包含每个匹配修改经 select 转换后的结果。

示例

获取所有正在运行的修改的 variables:

angular-ts
1@Component({2  selector: 'pending-posts',3  template: `{{ pendingVariables().length }} posts saving...`,4})5export class PendingPosts {6  readonly pendingVariables = injectMutationState(() => ({7    filters: { status: 'pending' },8    select: (mutation) => mutation.state.variables,9  }))10}

通过 mutationKey 获取特定修改的所有 data:

angular-ts
1const mutationKey = ['posts']2 3@Component({4  selector: 'posts',5  template: `6    <button (click)="createPost()">7      Create post ({{ savedPosts().length }} saved so far)8    </button>9  `,10})11export class Posts {12  // Some mutation that we want to get the state for13  readonly createPostMutation = injectMutation(() => ({14    mutationKey,15    mutationFn: createPosts,16  }))17 18  readonly savedPosts = injectMutationState(() => ({19    // this mutation key needs to match the mutation key of the given mutation (see above)20    filters: { mutationKey, status: 'success' },21    select: (mutation) => mutation.state.data,22  }))23 24  createPost() {25    this.createPostMutation.mutate(['New Post'])26  }27}

本页为 TanStack Query 文档(Angular 版)的非官方中文翻译,原文由上游团队维护,遵循 MIT 许可。 译文如有偏差,以英文原文为准。

译自上游 59d11de