salesforce / akita

🚀 State Management Tailored-Made for JS Applications
https://salesforce.github.io/akita/
Apache License 2.0
3.7k stars 344 forks source link

Async pipe does not trigger change detection #758

Open xaosaki opened 3 years ago

xaosaki commented 3 years ago

I'm submitting a...


[ ] Regression (a behavior that used to work and stopped working in a new release)
[ ] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[x] Support request
[ ] Other... Please describe:

Current behavior

(Better look example) I got some strange behaviour. I use subscription on property in store for load some data. And i want use loading indicator. I use OnPush strategy. Async pipe does't trigger changeDetection and do not redraw value in UI. But if i subscribe in component and manually do detectChanges everything will be ok.

Expected behavior

I want use async pipe for my case.

Minimal reproduction of the problem with instructions

https://stackblitz.com/edit/angular-ivy-ytzx8j

  1. Open console
  2. Click on 1st button
  3. You will see true and after 2 seconds false
  4. In UI you will see only false
malvin-rgba commented 3 years ago

Adding delay(0) to your pagination$ query solves the problem: https://stackblitz.com/edit/angular-ivy-waj96n?file=src%2Fapp%2Fakita.service.ts

rohovtsov1 commented 1 year ago

@xaosaki This has nothing to do with Angular. This is shitty akita state managment by design. Here is your problem fully described: https://github.com/salesforce/akita/issues/1065

The issue in your example happens this way: 1) trigger pagination change, [loading = false] 2) pagination changed, notifying listners via select(), [loading = false] 3) fetchResult() is called, this.store.setLoading(true) called, [loading = true] 4) pagination change finally ends, and resubmits previous value, [loading = false]

So you get synchronosly loading = false, loading = true, loading = false. And the final result is false, so you see no changes. Avoid akita, and use built-in Angular features