react-query-questions
solid-query-questions
table-questions
virtual-questions
router-questions
react-charts-questions
ranger-questions
vue-query-questions
svelte-query-questions
bling-questions
form-questions
angular-query-questions
start-questions
db-questions
start-showcase
router-showcase
📣-announcements
Curious behavior in zoneless application
I use tanstack query angular in my zoneless application and there is some strange behaviour when rendering the app on the server.
It seems like the .data() signal of my query fires before the .isSuccess() does. This causes the returned state from the server to always have my loading placeholder.
Something that has helped to fix this issue was to introduce a job, which completes as soon as the query is successful.
```ts
constructor() {...
Query data on-demand
In some cases I want to run a couple of queries in parallel on-demand (a button click for example).
I have tested various ways to do this:
- Use mutations with
mutateAsync and Promise.all -> works but does not use caching
- Set enabled: false on the query and use refetch() -> works but does not use caching...When will the Angular version of Tanstack Query be stable?
Hi! I’ve been following the progress on the Angular integration for TanStack Query and I’m really interested in using it in a production project. I saw there’s an alpha version available, but I’m wondering if there’s any timeline or roadmap for a stable release. Any updates or insights would be appreciated!
Thanks in advance 😊...
Angular SSR and Tanstack Query
I have fully-client-rendered application and mostly using
@tanstack/angular-query-experimental, how hard would be to have that now moved to the server side. Is it doable at all?Unexpected behaviour with default option throwOnError: true
Hi,
First of all, thanks for the Angular adapter of tanstack query. Working with it is a delight so far 😎.
I do have a small issue that I can't explain or find a fix for. I'm experiencing weird behaviour when using the
throwOnError: true setting as the default in the QueryClient options. A reproduction scenario can be found here: https://github.com/JoepKockelkorn/tanstack-angular-throw-on-error-bug....Major type inference difference in templates between VS Code and WebStorm
Hey there. We've been using the library quite successfully and honestly it's been a bliss.
The issue I have is actually not with TanStack but WebStorm. I've been experiencing a major difference with type inference inside templates between VSCode and WebStorm. And I'm curious if it's just me or it's a bigger issue with WebStorm.
Type narrowing in WebStorm seems to be broken...
isSuccess signal is not triggering on infiniteQuery
```javascript
effect ( () => {
console.log( this.query.isSuccess() );
...
Should skipToken behave just like enabled?
I have code that is analogous to:
```ts
@Injectable({ providedIn: 'root' })
export class EntityQueriesService {
public detail(id: number | undefined) {...
When using an infiniteQuery on a POST request, it doesn't cache the request.
Is it true that Queries that use POST requests are treated like mutations and are not being cached, or cache is assigned only for Mutations?
because my data wont cache when I use query with POST...
Disable refresh and first request
I want to disable the first request made, as I am using tanstack angular experimental together with ngx store, which would be based on actions, and because of that I don't want it to perform the requests when the service is injected, and the only adaptation I verified is to put an enabled: false and then modify the status.
```ts
@Injectable()...
Angular Tanstack Query
I am using Tanstack in my application and when a user logs in, I have a query that runs as part of the Auth to retrieve user profile info.
I want to use the results of the query in a route guard to ensure users complete their profile before being able to access any other pages but I can't access anything from the query after injecting the AuthService because the query has not finished.
Looking for some advice on how to achieve what I'm looking for....
Query/page Update following mutation
I have a component that uses injectQuery to fetch some data. I assign the .data() part to a computed signal.
...
query = injectQuery(queryName(value));
results = computed(() => this.query.data());
query = injectQuery(queryName(value));
results = computed(() => this.query.data());
Wrapper around injectQuery
Has anyone been able to create a wrapper around injectQuery?
I want to extend the query so that it has some more methods.
Doing a simple shallow copy of the query works well:
```ts
const q = injectQuery(optionsFn)...
QueryOptions
I just upgraded to the latest version and now my query options don't build.
```
userInfo = (userId: Signal<string|null>) => {
return () => queryOptions({
queryKey: ['userInfo', userId()],...
Usage with trpc
Hey there, I guess this question could apply to all of the query implementations.
I'm using angular query with trpc and was wondering if I can conveniently extract the errorShape from my procedure type.
TRPC already has a
procedure.errorShape property that carries the information. Secondly you have procedure.query() as the async query function.
I wonder if it is possible to implement something like injectTrpcQuery that would have the client already and mainly provide a way to select the respective procedure. It could then infer the error and call the query function with just the query key, which would have to have the shape of the input I guess.
I'm not sure yet how this would work with paginated queries. I'll go ahead and try to write this funciton but would be very glad for pointers or input....Cache transfer with SSR
I was wondering if there is some guidance on using angular query with ssr.
The cache transfer for httpClient could probably take are of most of the hydration but I was wondering if there is a more direct integration that can be used....
Questions about recent changes
Looking at the commits in the last month or so, several breaking changes have occurred:
-
provideAngularQuery is renamed to provideTanStackQuery
- injectQuery and injectMutation no longer supply the query client as the first parameter of optionsFn
- mutationOptions is now a thing?!? I assumed it wasn't necessary (https://github.com/TanStack/query/discussions/6096#discussioncomment-7172042)
...Tester raised: API call gets called multiple times when getting empty response
Hi All,
I am using tanstack query in API calling, it was triggering multiple times when response was empty but status 200, moreover zod used for response data validation.
Can you please explain how to solve this.....
Blog post reviews requested
I made a blog post about using Angular query in route guards. @arnoud or anyone who is willing, can you take a look and make sure it is factually correct?
Review needed: a college did a PR about the typing
https://github.com/TanStack/query/pull/7923 is it possible for someone to review it.
We intend to contribute to make this angular version a not experimental reality by the way.
Thx...