Skip to content

Commit 8183650

Browse files
committed
Merge branch 'master' of http://github.com/wbuchwalter/ng-redux
2 parents 099ad13 + d57fa0f commit 8183650

File tree

1 file changed

+19
-19
lines changed

1 file changed

+19
-19
lines changed

README.md

Lines changed: 19 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,9 @@ ngRedux lets you easily connect your angular components with Redux.
1111
the API is straightforward:
1212

1313
```JS
14-
reduxConnector.connect(selector, callback);
14+
$ngRedux.connect(selector, callback);
15+
//OR
16+
$ngRedux.connect([selector1, selector2, ...], callback);
1517
```
1618

1719
Where selector is a function taking for single argument the entire redux Store's state (a plain JS object) and returns another object, which is the slice of the state that your component is interested in.
@@ -24,7 +26,7 @@ Note: if you are not familiar with this syntax, go and check out the [MDN Guide
2426
If you haven't, check out [reselect](https://github.com/faassen/reselect), an awesome tool to create and combine selectors.
2527

2628

27-
This returned object will be passed as single argument to the callback provided whenever the state changes.
29+
This returned object will be passed as argument to the callback provided whenever the state changes.
2830
ngRedux checks for shallow equality of the state's selected slice whenever the Store is updated, and will call the callback only if there is a change.
2931

3032

@@ -59,9 +61,9 @@ angular.module('app', ['ngRedux'])
5961

6062
class TodoLoaderController {
6163

62-
constructor(reduxConnector) {
64+
constructor($ngRedux) {
6365
this.todos = [];
64-
reduxConnector.connect(state => state.todos, todos => this.todos = todos);
66+
$ngRedux.connect(state => state.todos, todos => this.todos = todos);
6567
}
6668

6769
[...]
@@ -72,33 +74,37 @@ class TodoLoaderController {
7274

7375

7476

75-
You can also create multiple connections in single component:
77+
You can also grab multiple slices of the state by passing an array of selectors:
7678

7779
```JS
7880
constructor(reduxConnector) {
7981
this.todos = [];
8082
this.users = [];
81-
reduxConnector.connect(state => state.todos, todos => this.todos = todos);
82-
reduxConnector.connect(state => state.users, users => this.users = users);
83+
$ngRedux.connect([
84+
state => state.todos,
85+
state => state.users
86+
],
87+
(todos, users) => {
88+
this.todos = todos
89+
this.users = users;
90+
});
8391
}
8492
```
8593

8694

8795
#### Unsubscribing
8896

89-
You can close a specific connection like this:
97+
You can close a connection like this:
9098

9199
```JS
92100

93101
constructor(reduxConnector) {
94102
this.todos = [];
95-
this.users = [];
96-
this.disconnectTodos = reduxConnector.connect(state => state.todos, todos => this.todos = todos);
97-
reduxConnector.connect(state => state.users, users => this.users = users);
103+
this.unsubscribe = reduxConnector.connect(state => state.todos, todos => this.todos = todos);
98104
}
99105

100-
disconnectSome() {
101-
this.disconnectTodos();
106+
destroy() {
107+
this.unsubscribe();
102108
}
103109

104110
```
@@ -115,9 +121,3 @@ redux.bindActionCreators(actionCreator, $ngRedux.getStore().dispatch);
115121

116122
### Example:
117123
An example can be found here (in TypeScript): [tsRedux](https://github.com/wbuchwalter/tsRedux/blob/master/src/components/regionLister.ts).
118-
119-
120-
## Todo:
121-
- Better unsubscribing
122-
- Less boilerplate for classic use case
123-

0 commit comments

Comments
 (0)