Angular bindings

[nhducit]

hi everyone our company has several Angular projects and looking for a better way to handle server cache. React-query is always the library I wished it could exist for angular. Now, v4 is already providing bindings for React, Vue, and Solid. I really wish that we can also make Angular bindings.

I'm exploring query core to make the Angular bindings, I have some questions:

• Do we have any documents to create a binding?
• Are there any recommended approaches I should follow?

As far as I know, query core already provides the caching/invalidate cache mechanism, What I need to do are

• set up angular listen to query data
• unsubscribe query if the angular component is unmounted

Someone implement a library with similar ideas but it's deprecated now
https://github.com/timdeschryver/rx-query

Update 1:

• due to the Angular rendering nature, the Angular Class component is only executed for the first time. So we need to find a way to notify the created query-dependent array is updated and the query also needs to notify the updated query result to the component. rxjs Subject (maybe BehaviorSubject? I'm not an rxjs expert) seems to be a good candidate here.

A BehaviorSubject holds one value. When it is subscribed it emits the value immediately. A Subject doesn't hold a value.

We should use BehaviorSubject instead of Subject

class AngularComponent() {

users$ = useQuery(queryDependentArray$, queryFn)
}

the dollar sign $ is a naming convention that marks the variable as an rxjs Observable

[andrey99z]

Same here, need replacement for rx-query and react-query seems perfect with it's core not being react dependent.

I've got some working code here:
https://codesandbox.io/s/sad-jones-km6tq9

Not sure if this is the right approach, happy to discuss.

[nhducit]

nice, thanks @andrey99z I'm following React bindings implementation, read rx-query source code

[nhducit]

I created a new issue FYI
andrey99z/query#1

[andrey99z]

Great, suggest moving further discussions there.

[ApplY3D]

Hi guys, Im interested too about react-query for Angular 🔥

[andrey99z]

@ApplY3D your contributions are welcome :)

[trungvose]

The ngneat team from @NetanelBasal has just released a beta version for ngneat/query. Check it out guys 👋

https://github.com/ngneat/query

[ApplY3D]

react deps instead of direct core @tanstack/query-core dep only while beta?

[rbalet]

TanStack Query now has its own Angular library! 🎉
Feel free to try it out: TanStack Query for Angular.