依赖查询

更新于 2026-11-02 Angular 查看英文原文 ↗

injectQuery 依赖查询

依赖查询（或称串行查询）需等待前一个查询完成之后才能执行。要实现这一点，只需使用 enabled 选项来告知查询它何时可以运行：

TypeScript

1// Get the user2userQuery = injectQuery(() => ({3  queryKey: ['user', email],4  queryFn: getUserByEmail,5}))6 7// Then get the user's projects8projectsQuery = injectQuery(() => ({9  queryKey: ['projects', this.userQuery.data()?.id],10  queryFn: getProjectsByUser,11  // The query will not execute until the user id exists12  enabled: !!this.userQuery.data()?.id,13}))

projects 查询将首先进入：

TypeScript

1status: 'pending'2isPending: true3fetchStatus: 'idle'

一旦 user 可用，projects 查询就会被 enabled，并随即过渡到：

TypeScript

1status: 'pending'2isPending: true3fetchStatus: 'fetching'

获取项目后，它将进入：

TypeScript

1status: 'success'2isPending: false3fetchStatus: 'idle'

injectQueries 依赖查询

动态并行查询——injectQueries 同样可依赖于前一个查询，实现方式如下：

TypeScript

1// injectQueries is under development for Angular Query

注意：injectQueries 返回的是一个查询结果数组

关于性能的一点说明

依赖查询本质上构成了一种请求瀑布，这会损害性能。假设两个查询耗时相同，串行执行它们所需时间总是并行执行的两倍；当这种情况发生在高延迟客户端上时，性能影响尤为明显。如果可能，最好重构后端 API，使两个查询能够并行获取；不过在实际中，这并不总是可行。

在上述示例中，与其先获取 getUserByEmail 再据此执行 getProjectsByUser，不如引入一个新的 getProjectsByUserEmail 查询，从而压平该请求瀑布。