angular-redux / ng-redux

Angular bindings for Redux
MIT License
1.16k stars 178 forks source link

How to use multiple Actions in single $ngRedux.connect()? #202

Closed jisuo closed 6 years ago

jisuo commented 6 years ago

So lets say I have this:


export default class HomeController {
  constructor($ngRedux) {

    this.todo = '';
    this.unsubscribe = $ngRedux.connect(this.mapStateToThis, TodoActions)(this);
  }

  submitTodo(){
    this.addTodo(this.todo);
    this.todo = '';
  }

  $onDestroy(){
    this.unsubscribe();
  }

  mapStateToThis(state) {
      return {
          todos: state.todos
      };
  }
}

And now I also want to connect my ReminderActions in the same Controller.

How do I do that without duplicating code like:

this.unsubscribe2 = $ngRedux.connect(this.mapStateToThis2, ReminderActions)(this);

jisuo commented 6 years ago

I figured it out, this works:

import { bindActionCreators } from 'redux';

...

const actions = dispatch => ({
   todoActions: bindActionCreators(TodoActions, dispatch),
   reminderActions: bindActionCreators(ReminderActions, dispatch),
});
this.unsubscribe = $ngRedux.connect(this.mapState, actions)(this);

...

this.todoActions.addTodo(todo);
this.reminderActions.addReminder(reminder);