You see the actions and changes of actions there:
- action fires
- Action possibly triggers effects that trigger actions again
- Each action has a change which is done by the reducers
Hey everyone, I've a question about setting up ngrx/schematics (using npm link) locally to work on a bug. I'm trying to solve an issue with the "feature" schematic. A bit stuck with the local setup and need your help 🙏 .
Here's my local setup,
Folder structure:
ngrx-schematics-fix/
- platform/ - Cloned the repo here
- platform-playground/ - New angular projectI ran npm link in platform/modules/schematics, followed by npm link @ngrx/schematics and npm i @ngrx/schematics in the platform-playground directory.
This installed the local copy of plugin in the playground angular project.
But when I try to use a schematic now, I get a "Cannot found module" error:
➜ platform-playground git:(master) ✗ ng generate feature dashboard/store/Dashboard -m dashboard/dashboard.module.ts --group
An unhandled exception occurred: Cannot find module '/Users/hemang/projects/ngrx-schematic-fix/platform/modules/schematics/src/feature'
Require stack:
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular/cli/models/schematic-engine-host.js
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular/cli/models/schematic-command.js
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular/cli/commands/generate-impl.js
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular-devkit/schematics/tools/export-ref.js
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular-devkit/schematics/tools/index.js
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular/cli/utilities/json-schema.js
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular/cli/models/command-runner.js
- /Users/hemang/projects/ngrx-schematic-fix/platform-playground/node_modules/@angular/cli/lib/cli/index.js
- /usr/local/Cellar/nvm/0.37.2/versions/node/v16.7.0/lib/node_modules/@angular/cli/lib/init.js
- /usr/local/Cellar/nvm/0.37.2/versions/node/v16.7.0/lib/node_modules/@angular/cli/bin/ng
See "/private/var/folders/0z/dklrs6s14zl89vq7gj585mz00000gn/T/ng-j5OyDb/angular-errors.log" for further details.I do have @ngrx/schematics set as the defaultCollection in angular.json. The package.json looks like,
"dependencies": {
"@angular/animations": "~12.2.0",
"@angular/common": "~12.2.0",
"@angular/compiler": "~12.2.0",
"@angular/core": "~12.2.0",
"@angular/forms": "~12.2.0",
"@angular/platform-browser": "~12.2.0",
"@angular/platform-browser-dynamic": "~12.2.0",
"@angular/router": "~12.2.0",
"rxjs": "~6.6.0",
"tslib": "^2.3.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "~12.2.2",
"@angular/cli": "~12.2.2",
"@angular/compiler-cli": "~12.2.0",
** "@ngrx/schematics": "file:../platform/modules/schematics",**
"@types/jasmine": "~3.8.0",
"@types/node": "^12.11.1",
"jasmine-core": "~3.8.0",
"karma": "~6.3.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage": "~2.0.3",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "~1.7.0",
"typescript": "~4.3.5"
}
1 reply
I have an issue I'm hoping someone might be able to help me resolve. I think I read someplace that effects are executed in the order they are registered in the EffectsModule.forFeature/Root. However, how does this work when I need effects from feature2 to run first and then effects from feature1?
My scenario is this. Upon signout I need to make some apis using jwts stored in auth state. So obviously I can't have the auth state reset until that is done. I was hoping there was a way to do this without having add complicated checks in the signout effect to see if the "clean" up effects have finished running. Any suggestions?
I got the proper way to do it by doing
export const getInvoiceFiltering = createSelector(
invoicesFeature, state => state.filter
);
export const getInvoicePageSort = createSelector(
invoicesFeature, state => state.sort
);
export const sortAndFiltering = createSelector(
getInvoiceFiltering, getInvoicePageSort, (filter, sort) => {
return {sort, filter};
}
);@this-is-me:matrix.org is it because I'm getting all the state in the previous, and by "funneling" down the slices of the state?
So do you maybe fire an action based on your subscription, or do you maybe fire actions in your effects that could trigger a change?
I have an effect to get invoices but I wanted to trigger a new fetch whenever the filter or sort would change,
It worked fine if I just used getInvoiceFiltering or getInvoicePageSort but as soon as I would use this selector :point_up: September 15, 2021 4:00 PM it would trigger the infinite loop
Let's say I have an action that is one of two types. Ie ofType(actionType1, actionType2)
In the result I can check the .type to see which of the types it is...
However, how can I then cast that result as the type it is, rather than just any. This then giving me typed access to the action's props
ofType(Actions.initSuccess, Actions.initFail),
map(action => {
if (action.type === Actions.initSuccess.type) {
const something = (action as ?).propertyOnlyExistingOnSuccessType;
}
})
Hi there,
Could someone please explain me this syntax { users } on extracting the payload of an action?
createReducer( initialState,
on(myAction, ( state, { users } ) => ( // I don't understant how is that able to extract the payload
{
...state,
users: [...users]
})
)
export const myAction = createAction('[Users] Set Users',
props<{ users: User[] }>()
);I am mainly a Java developer that's maybe the reason I am a bit confused.
Thank you
2 replies
I'm learning about share(), and have understood that whenever number of subscribers go to 0 or source complete, it will "restart" the source. This should be configurable with the config passed to share.
As I see it, this should only print "1" once. But it does it for every subscription. Can anyone explain why?
const testObs = rxjs.of(1).pipe(rxjs.operators.share({ resetOnComplete: false, resetOnRefCountZero: false }))
testObs.subscribe(console.log),
testObs.subscribe(console.log)
NGRX selectors using the factory method. How do I go about calling one inside another selector when inside a loop? I must be missing something, as this feels like quite a common use case, but I can't find any examples. The problem is I'd normally pass the prop into the factory method during the createSelector call, but in this instance I don't know that value as I need to loop though a bunch of Ids to get each one.
I can sort of get it to work using the below code, but this is returning an array of MemoizedSelector, so the further selection isn't happening:
const selectThingWithMeta = (thingId: number) =>
createSelector(
thingA.selectEntityMap,
thingB.selectEntityMap,
thingCSelectorThatNeedsThingId(thingId),
(
thingA,
thingB,
thingC
) => {
return slice of state here
});
// need this because I don't know the value to pass into the selectThingWithMeta factory of the createSelector method, because this data comes form the array of Ids.
const selectThingWithMetaFactory = () => selectThingWithMeta;
const selectThingsWithMeta = (thingIds: number[]) =>
createSelector(selectThingWithMetaFactory, (thingSelector) => {
return thingIds
.map((thingId) => thingSelector(thingId))
});
However, ngrx/platform#1649 and https://stackoverflow.com/questions/55319705/ngrx-asynchronous-meta-reducer suggest that it doesn't work with async calls (and also should not work).
You could use synchronous calls (seems possible with indexeddb) or handle it through effects
