Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 02:18
    dpurp opened #6375
  • May 06 22:25
    benlesh closed #6143
  • May 06 22:25

    benlesh on master

    chore: deprecate thisArg signat… (compare)

  • May 06 22:25
    benlesh closed #6361
  • May 06 22:22

    benlesh on master

    fix(share): propagate closed to… (compare)

  • May 06 22:22
    benlesh closed #6370
  • May 06 21:52

    dependabot[bot] on npm_and_yarn

    chore(deps-dev): bump lodash fr… (compare)

  • May 06 21:52
    dependabot[bot] labeled #6374
  • May 06 21:52
    dependabot[bot] opened #6374
  • May 06 19:32
    kwonoj review_requested #6373
  • May 06 19:31
    kwonoj review_requested #6373
  • May 06 19:31
    kwonoj opened #6373
  • May 06 19:27

    kwonoj on export-internal

    build(package): support interna… test(lint): update config (compare)

  • May 06 19:22

    kwonoj on export-internal

    build(package): support interna… test(integration): update test … build(lint): update lint config (compare)

  • May 06 15:34
    splincode commented #5312
  • May 06 14:34

    benlesh on master

    fix(bindCallback): resulting fu… (compare)

  • May 06 14:34
    benlesh closed #6369
  • May 06 13:51
    duanehutchins opened #6372
  • May 06 11:35

    cartant on master

    Update 6-to-7-change-summary.md… (compare)

  • May 06 11:35
    cartant closed #6371
Alex
@alvipeo
here we go:
   timeUntilNextSendAllowed$: Observable<number | null> = this.isCodeSent$.pipe(
      startWith(false),
      pairwise(),
      // tap(console.log),
      filter(([prev, curr]) => curr === true && prev === false),
      exhaustMap(() => concat(interval(1000).pipe(take(5)), of(null).pipe(tap(() => this.resetCodeSent())))),
      repeat()
   );
Dorus
@Dorus
aaah i see you use concat to delay the call to resetCodeSent :D
Alex
@alvipeo
well... nothing else comes to mind ;)
Dorus
@Dorus
Could also do Interval(1000).pipe(take(5), tap({complete: () => this.resetCodeSent()}))
Well i found your solution nice :)
Alex
@alvipeo
oh, complete!
thank you!
Alex
@alvipeo
@dorus, beta version :)
   timeUntilNextSendAllowed$: Observable<number | null> = this.isCodeSent$.pipe(
      startWith(false),
      pairwise(),
      filter(([prev, curr]) => curr === true && prev === false),
      tap(console.log),
      exhaustMap(() =>
         of(15).pipe(
            switchMap((period) =>
               timer(0, 1000).pipe(
                  take(period),
                  map((i) => period - i),
                  tap({ complete: () => this.resetCodeSent() })
               )
            )
         )
      ),
      repeat(),
      share()
   );
Dorus
@Dorus
@alvipeo Does repeat do anything on isCodeSent$? I dont think it'll ever complete right?
Alex
@alvipeo
@Dorus yeah, thank you again... I get back to RxJS once in a while but hopefully I'll stop making these mistakes one day :)
Kamil
@Chester97
Hi Guys! How to make fetch Api based on interaction with user? For exmaple, I’m scrolling the page, when I get to the bottom of the page, I would like to download more data. Let’s say I’m using this: https://pokeapi.co/api/v2/pokemon?limit=10 <— so I can change limit to 20,30,40… but still save previous records. How to make something like this in rxjs?
Dorus
@Dorus
@Chester97 first you should call https://pokeapi.co/api/v2/pokemon?offset=10&limit=10, not increase the limit, but add a offset.
Beside that this is a simple infinite scroll scenario. There are resources for that online. Rxjs can aid a lot in writing the queries that react to the scroll events.
I know for one that angular material has a infinite scroll component including a nice interface to implement. I think it's among the virtual scroll stuff.
I also found this blog: https://blog.strongbrew.io/infinite-scroll-with-rxjs-and-angular2/
Kamil
@Chester97
That’s right! I want to write my own infiniteScroll but apply it to React app.
Thank You :)
Ramon P.
@AlteredCarbonate
Salut
Are there any good resources for getting started. Which include comparison to Promises? 🤔😅
Dorus
@Dorus
Comparison to promise is here: https://rxjs.dev/guide/observable
Kamil
@Chester97
Hi, I need conditionally invoke some stream base on results from first one. Something like mergeMap maybe? Basicly I’m detecting my scroll position, when scroll will reach specific postion I would like dwonload some data. What is the best way to do that kind of operations? For now i have something like that:
https://gist.github.com/Chester97/39b491b3ab773eb0a5f14e7d4c85b3ef
Dorus
@Dorus
@Chester97 yes that looks right
What problems are you having?
You could also consider switchMap, where a new scroll would cancel the ongoing request. Or take exhaustMap so that ongoing requests have to finish before requesting more data. ExhaustMap would require you to build something that retriggers it if the users scrolls too far during the last fetch and then stops scrolling.
The mergeMap approuch however is the most straightforwards one. Do make sure you add something to hold off requests for data you're already retrieving at the same time.
Kamil
@Chester97
Right, but with this example I have an error, because I can’t return stream conditionally, but i have fix this problem in another way, btw - I’ll try switchMap :) Thank You
Dorus
@Dorus
@Chester97 you can return EMPTY if you dont want to do anything.
Or, you could filter before you reach the merge-/switchMap. In fact, for switchMap that would be required, as EMPTY would leave it doing nothing.
Also you could consider a debounceTime before the whole thing. But that's just nice optimizations :)
mohammadzbggo
@mohammadzbggo
Hi, how do I turn a function with multiple callback parameters into a an observer?function(param1, successCallback, errorCallback) { //.. do stuff }
Ramon P.
@AlteredCarbonate

@AlteredCarbonate https://rxjs.dev/guide/overview

I looked at the docs several times by now, sadly I couldn't get the hang of it.

Maybe I should share a gist of my code - Someone, with time and kindness could transform it into RxJS Likecode. As direct reference :o

Dorus
@Dorus
@mohammadzbggo look at bindNodeCallback and bindCallback
@AlteredCarbonate There are more good references, anything specific you're looking for? Myself i learned a lot from http://introtorx.com/ but that's for Rx.net
also yes you can totally share some bits of code and ask for ideas :)
Ramon P.
@AlteredCarbonate

@Dorus https://gist.github.com/AlteredCarbonate/86af506d32558c35653db50fc1881796
I'll just share it here <-<
A friend told me, who is frequently in touch with RxJS. That I did a lot things, already possible in RxJS itself.
But there're just to many Operators, and I still try to stick with the Promisebased Structure (And then, And then, And then...) ^_^

Any help is welcome <3

Dorus
@Dorus

@AlteredCarbonate a couple things (i only looked 3 seconds). Do not nest subscribe, instead flatten the stream using the flatmap operators like mergeMap, switchMap, concatMap, exhaustMap. They all allow you to flatten the stream, but each has different concurrent behavior
Thus, if you do source.map(e => someRequest(e)) you would get Observable<Observable<result>>, but with source.mergeMap(e => someRequest(e)) you would get the flattened result: Observable<Result>.
That way, you only need to subscribe at the end of your pipe. Better: Often you do not need to subscribe at all, you can write functions that return observable (like the someRequest function in my example).
Also you shouldnt need new Observable, at least not too much. There are many creating operators. If you are overwhelmed by them, use the decission tree to find the right one.
If you do use new Observable, you could make use of the cleanup callback you're allowed to return from the onSubscribe function.

new Observable(ob => {
  let i = 0;
  let t = setInterval(() => ob.next(i++), 1000);
  return () => clearTimeout(t);
}).pipe(take(5))

Here i take advantage of the take(5) operator to cancel the endless observable i made, making it call clearTimeout(t) after 5 emissions.
Also this could be even shorter with interval(1000).pipe(take(5)).

Ramon P.
@AlteredCarbonate
Omg.
Thank you very much, I'll try to rework it with your given links.
But Is a bit overwhelming 🤣🤣
Dorus
@Dorus
@AlteredCarbonate No worries :) Take it slowly and feel free to come back if you have more questions.
Nico
@ndcunningham
hey all!
is it possible to have two observable one (obA$) starts off the stream
the other observable (obB$) is then kicked off to start emitting until a valid value is emitted.
obB$ then stops emitting and is restarted again when obA$ emits again
Nico
@ndcunningham
think i found it out !
Dorus
@Dorus
@ndcunningham obA$.pipe(switchMapTo(obB$.pipe(first(isValid.bind(this))))), where isValid is a function that decide if the value valid.
first <-> find could be exchanged depending on your need
Nico
@ndcunningham
hmm never used switchMapTo before but i just did a
obA$.pipe(mergeMap(aResult => obB$.pipe(filter(foo => isValid(foo)),take(1), map(bResult => ({ aResult, bResult})))
Something like this
Dorus
@Dorus
@ndcunningham Ah i didnt realize you needed to combine the a and b result. In that case xxxMapTo wont work.
And filter+take(1) can be combined in find.
Pretty much the same solution beside those differences
Nico
@ndcunningham
oh find
should've thought of that :sweat_smile: