Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Document and add example for using "select" #14

Open
rubyboy opened this issue May 9, 2016 · 8 comments
Open

Document and add example for using "select" #14

rubyboy opened this issue May 9, 2016 · 8 comments

Comments

@rubyboy
Copy link
Contributor

rubyboy commented May 9, 2016

Document (in README) and add example (in angular-redux-example?) for using the "select" observable technique
Implementation done in this PR: #12

CC @micha149

@rubyboy
Copy link
Contributor Author

rubyboy commented May 9, 2016

Added example of using the new "select" in the angular-redux-example:
Commit: InfomediaLtd/angular2-redux-example@a6d7a07

    private parts$ = null;
    private partsInCart$ = null;

    constructor(appStore:AppStore, partActions:PartActions, cartActions:CartActions) {
        this.parts$ = appStore.select("parts");
        this.partsInCart$ = appStore.select(partsInCartSelector);

@micha149
Copy link
Contributor

micha149 commented May 9, 2016

You could do something like passing the currentUser$ observable directly into the user component and let the component mark for change detection if the observable changes…

  constructor(private cd: ChangeDetectorRef) {}

  ngOnInit() {
    this.data.subscribe(() => {
      this.cd.markForCheck(); // marks path
    })
  }

This is were working with observables really gives a benefit on performance…
http://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html

@micha149
Copy link
Contributor

micha149 commented May 9, 2016

It would make sense to place all selector functions into separate files. So, you don't have to worry where to find your required data in the state. Just include the respective selector function and use it. A folder named selectors as a sibling to reducers would be a common place for such files.

@rubyboy
Copy link
Contributor Author

rubyboy commented May 9, 2016

Agree about separating selectors into files. Absolutely makes sense. Will do that tomorrow.

Re the change detection, I quite like the fact that the observable itself triggers change detection when data flows in and it's all internal to the mechanism. This way it's all handled nicely by Angular without boilerplate code.

One other issue I was looking at and didn't find a solution was the state that is used in functions. Look at the AdminComponent and how is uses the filmFilter. Any idea how to use this with a selector? (I can't simply use async because it uses the filter as a param to a function. Also, it is used as a toggle for UI text (on/off) ).

@micha149
Copy link
Contributor

Why not writing the value to a class property on update?

@rubyboy
Copy link
Contributor Author

rubyboy commented May 10, 2016

That's what it does right now, using a "subscribe" :)

@micha149
Copy link
Contributor

Yeah, that's what I meant. I didn't looked at the code since yesterday evening. But the night brought me no better solution 😄 I think this is not a bad solution. Why enforcing to use observables everywhere, also when it makes no sense?

@rubyboy
Copy link
Contributor Author

rubyboy commented May 10, 2016

You're right! :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants