How to retrieve a created entry from outside using Angular-redux store -


the context

i'm using basic store ecosystem actions, epics, reducers using angular-redux store.

to summarize : little graph of store

my state

state |_ accounts   |_ items   |_ paginations   |_ loading   |_ errors |_ applications   |_ items   |_ paginations   |_ loading   |_ errors 

so component, on creation entry calling corresponding action. (i removed non-necessary code)

export class applicationnewcomponent  implements oninit {    private application;    constructor(private collection: collectionactions) {}    onsubmit() {     this.collection.createentry(collection_types.application, {}, this.application);     }; } 

the collectionactions dispatch action. reducer checks if has on state. epics receive action, required checks before calling service api if needed, depending on answer, call corresponding action, , reducer act, update state. nothing new redux user.

from applicationlistcomponent, subscribe applications.items, applicationdetailcomponent i'm subscribing specific item of list, etc.

the problem

my problem applicationnewcomponent should create entry, don't know retrieve new entry in clean way.

with current store behavior , without watching whole collection compare previous , new state, don't know how inform applicationnewcomponent entry has been created , has id 14. (as example)

the easiest way see solve issue add new key in state, called 'lastcreatedentry', use reducer fill part of api answer , subscribe in component.

is there way retrieve state diff outside store ?

is there way watch actions flow , not state ?

is there kind of situation ?

any advice/help welcome. i'm maybe mistaken on many points, please forgive poor english also.

i don't use angular-redux ngrx instead believe principle should same. in component subscribe part of store keeps colletion. not whole one, in general case might pagedcollection , newly created 1 falls out of current page shown.

you didn't specify, component do? show collections or want show update screen of last created entity or?

now, flow depends on particular component , needs. when need id other calls, mean? calls necessary done component or maybe better fit epics, example?

if its, example, update entity screen 1 want show setup component route component/{entityid} , redirect route epic using entityid epic got server.

as can see, highly dependant on want in component , ux flow.

[update] regarding 'direct communication between epic , dumb control'... don't want have. usual setup this:

  1. you have createcomponent
  2. after user finished input , submits, dispatch action, epic picks up, fires service.createnewrequest() returns newlycreatedid
  3. your epic knows newlycreatedid returned service , router.navigate('applicationdetailscomponent/newlycreatedid')
  4. you have applicationdetailscomponent (both, smart , dumb, of course) , route defined (route definition includes {id})
  5. you have guard canactivate route , in guard fire new request service.getapplicationbyid(id)
  6. completion of action picked reducer updates part of store named `selectedapplication'
  7. your applicationdetailscomponent subscribed `selectedapplication' part of store

you select entity collection have in store instead of firing request in 5. not idea because of paged collections. if have paged collections (which kept in store) , newly created entity falls out of current page have problem. better idea go separate request.

[update 2] if want have both things (create/edit) in same component yes, have part of store named selectedentity , fill last created one. name selectedentity on purpose because moments created on server, not addnewcomponent anymore editcomponent one. , in 1 subscribe selectedentity part of store. then, might create confusion because if route component, you'll have flag somehow in createnew mode (nothing saved yet) or in edit mode (something created , you're looking @ existing entity).


Comments

Popular posts from this blog

php - Vagrant up error - Uncaught Reflection Exception: Class DOMDocument does not exist -

vue.js - Create hooks for automated testing -

.htaccess - ERR_TOO_MANY_REDIRECTS htaccess -