https://github.com/michaelkrone/ngrx-normalizr-crud
CRUD reducer, actions, selectors and effects for ngrx-normalizr states
https://github.com/michaelkrone/ngrx-normalizr-crud
Last synced: over 1 year ago
JSON representation
CRUD reducer, actions, selectors and effects for ngrx-normalizr states
- Host: GitHub
- URL: https://github.com/michaelkrone/ngrx-normalizr-crud
- Owner: michaelkrone
- License: mit
- Created: 2017-09-15T23:16:24.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2018-02-20T19:19:21.000Z (over 8 years ago)
- Last Synced: 2025-04-22T21:05:42.893Z (over 1 year ago)
- Language: TypeScript
- Homepage: https://michaelkrone.github.io/ngrx-normalizr-crud/.
- Size: 233 KB
- Stars: 2
- Watchers: 2
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# WIP: ngrx-normalizr-crud
[](https://travis-ci.org/michaelkrone/ngrx-normalizr-crud)
> Actions, effects, reducers, selectors and guards for [ngrx-normalizr](https://github.com/michaelkrone/ngrx-normalizr).
This package provides a set of Actions, effects, reducers, selectors and guards for using [ngrx-normalizr](https://github.com/michaelkrone/ngrx-normalizr)
entity states.
## Installation
To install this package:
```sh
yarn add ngrx-normalizr-crud
npm i ngrx-normalizr-crud
```
### Peer dependencies
*ngrx-normalizr-crud* uses `@ngrx/store` and `ngrx-normalizer` as peer dependencies, so you need to install them if not present already:
```sh
yarn add @ngrx/store ngrx-normalizer
npm i @ngrx/store ngrx-normalizer
```
## Usage
Also refer to the [Typedoc documentation](https://michaelkrone.github.io/ngrx-normalizr-crud/).
##### reducer.ts
```javascript
import { createReducer, NormalizedEntityState, initialEntityState } from 'ngrx-normalizr-crud';
const entityReducer = createReducer(userSchema);
export function reducer(
state: NormalizedEntityState = initialEntityState,
action: any
) {
// do any reducer logic for your state or in this case
// simply return the result of the entity reducer
return entityReducer(state, action);
}
```
##### selectors
```javascript
import { createSelectors } from 'ngrx-normalizr-crud';
import { User, userSchema } from '../classes/user';
// create an entity state selector
const featureSelector = createFeatureSelector('users');
const getUserEntityState = createSelector(
featureSelector,
(state: State) => state.userEntity
);
export const entitySelectors = {
// pass the entity state selector
...createSelectors(userSchema, getUserEntityState)
};
```
##### actions.ts
```javascript
import { createActions } from 'ngrx-normalizr-crud';
import { User, userSchema } from '../classes/user';
export const actions = createActions(userSchema);
```
##### effects.ts
```javascript
import { EntityCrudEffect } from 'ngrx-normalizr-crud';
import { User, userSchema } from '../classes/user';
@Injectable()
export class UserCrudEffects extends EntityCrudEffect {
constructor(private actions$: Actions, private http: HttpClient) {
super(actions$, userSchema);
}
// use createSearchEffect, createUpdateEffect ...
@Effect()
searchEffect$ = this.createSearchEffect(
action => this.http.get('/users')
);
// ...
}
```
## State properties
```
loading: boolean;
selectedId: string;
query: any;
error: any;
```
## Selectors
```
getSelectedId: MemoizedSelector;
getLoading: MemoizedSelector;
getIds: MemoizedSelector;
getQuery: MemoizedSelector;
getError: MemoizedSelector;
getEntities: MemoizedSelector<{}, T[]>;
getSelectedEntity: MemoizedSelector;
```
## Meta
Michael Krone – [@DevDig](https://twitter.com/DevDig) – michael.krone@outlook.com
Distributed under the MIT license. See [``LICENSE``](https://github.com/michaelkrone/ngrx-normalizr-crud/blob/master/LICENSE) for more information.
[https://github.com/michaelkrone/ngrx-normalizr](https://github.com/michaelkrone/ngrx-normalizr-crud)
## Contributing
1. Fork it ()
2. Create your feature branch (`git checkout -b feature/fooBar`)
3. Commit your changes (`git commit -am 'Add some fooBar'`)
4. Push to the branch (`git push origin feature/fooBar`)
5. Create a new [Pull Request](https://github.com/michaelkrone/ngrx-normalizr-crud/compare?expand=1)