Skip to content

Commit

Permalink
docs(angular-query): update queryOptions documentation (#8311)
Browse files Browse the repository at this point in the history
* docs(angular-query): update queryOptions documentation

* ci: apply automated fixes

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
  • Loading branch information
arnoud-dv and autofix-ci[bot] authored Nov 19, 2024
1 parent 77b5f3a commit 6a9edbf
Showing 1 changed file with 23 additions and 10 deletions.
33 changes: 23 additions & 10 deletions docs/framework/angular/guides/query-options.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,23 +9,36 @@ ref: docs/framework/react/guides/query-options.md
```ts
import { queryOptions } from '@tanstack/angular-query-experimental'

groupOptions = (id: number) => {
return () =>
queryOptions({
queryKey: ['groups', id],
queryFn: () => fetchGroups(id),
staleTime: 5 * 1000,
@Injectable({
providedIn: 'root',
})
export class QueriesService {
private http = inject(HttpClient)

post(postId: number) {
return queryOptions({
queryKey: ['post', postId],
queryFn: () => {
return lastValueFrom(
this.http.get<Post>(
`https://jsonplaceholder.typicode.com/posts/${postId}`,
),
)
},
})
}
}

// usage:

injectQuery(groupOptions(1))
queries = inject(QueriesService)

injectQuery(this.queries.post(1))
injectQueries({
queries: [groupOptions(1), groupOptions(2)],
queries: [this.queries.post(1), this.queries.post(2)],
})
queryClient.prefetchQuery(groupOptions(23))
queryClient.setQueryData(groupOptions(42).queryKey, newGroups)
queryClient.prefetchQuery(this.queries.post(23))
queryClient.setQueryData(this.queries.post(42).queryKey, newGroups)
```

[//]: # 'Example1'

0 comments on commit 6a9edbf

Please sign in to comment.