nac

ngrx-action-creator-factory

An Action Creator Factory for ngrx

Showing:

Popularity

Downloads/wk

2

GitHub Stars

13

Maintenance

Last Commit

4yrs ago

Contributors

1

Package

Dependencies

0

License

MIT

Type Definitions

Built-In

Tree-Shakeable

No?

Categories

Readme

Ngrx Action Creator Factory

This is an angular 2 provider based (or a simple class) - read about the concept at Simple Action Creators for ngrx/store in Angular 2.
This service came out as a result of the open source project Echoes Player - an alternative player for watching and listening to media from youtube.

The Benefit - Minimal & Typed

This factory allows to decalre a minimal action creator declaration with a typed payload for the action creator function and have type support when using this function. This also results (in most cases) in a one line declaration.

Angular 2 Support

supports Angular 2 - Final - 2.2.1

LICENSE

MIT

Installation

npm install ngrx-action-creator-factory --save

Supported API

Currently supported:

  • ActionCreatorFactory.create(action: string, payload?: any)

Usage

First, import the ActionCreatorFactory to your module:

import { NgModule } from '@angular/core';
import { ActionCreatorFactory } from 'ngrx-action-creator-factory';

@NgModule({
  imports:[ BrowserModule ],
  providers: [ ActionCreatorFactory ],
  declarations: [ AppComponent, ],
  bootstrap: [ AppComponent ]
})
export class AppModule { }

platformBrowserDynamic().bootstrapModule(AppModule);

Next, use the ngrx-action-creator-factory either as a static factory or as an injectable provider:

import { Injectable } from '@angular/core';
import { Action } from '@ngrx/store';
import { ActionCreatorFactory } from 'ngrx-action-creator-factory';

@Injectable()
export class NowPlaylistActions {
  static MEDIA_ENDED = '[NOW PLAYLIST] MEDIA_ENDED';
  static QUEUE = '[NOW PLAYLIST] QUEUE';
  static SELECT = '[NOW PLAYLIST] SELECT';

  // as injectable
  constructor(private acf: ActionCreatorFactory) {
    this.queueVideo = this.acf.create(NowPlaylistActions.QUEUE);
    // This is the same as the above
    this.queueVideo = this.acf.create<void>(NowPlaylistActions.QUEUE);
  }

  // as a static method
  mediaEnded = ActionCreatorFactory.create(NowPlaylistActions.MEDIA_ENDED);
  // OR as a static typed method
  selectMedia = ActionCreatorFactory.create<GoogleApiYouTubeVideoResource>(NowPlaylistActions.SELECT);
}

Testing

To start developing tdd/bdd style: npm run dev This will: compile ts files, watch for changes and start the test task. Whenever a ts file is changed, it will rerun the tests.

Showcase Examples

Rate & Review

Great Documentation0
Easy to Use0
Performant0
Highly Customizable0
Bleeding Edge0
Responsive Maintainers0
Poor Documentation0
Hard to Use0
Slow0
Buggy0
Abandoned0
Unwelcoming Community0
100
No reviews found
Be the first to rate

Alternatives

No alternatives found

Tutorials

No tutorials found
Add a tutorial