Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Repo info
Activity
  • 17:08
    tmair opened #6098
  • 13:18
    cartant closed #5609
  • 13:18
    cartant commented #5609
  • 12:48
    cartant commented #5917
  • 12:46
    cartant labeled #5917
  • 08:03
    spierala commented #4740
  • 07:42
    cartant synchronize #6097
  • 07:37
    cartant review_requested #6097
  • 07:37
    cartant opened #6097
  • 06:54
    cartant review_requested #6096
  • 06:54
    cartant opened #6096
  • 06:40
    cartant edited #6095
  • 06:28
    cartant review_requested #6095
  • 06:28
    cartant opened #6095
  • 05:06
    cartant commented #6072
  • 05:06
    cartant commented #6072
  • Mar 06 22:25
    spierala commented #4740
  • Mar 06 19:26
    calebboyd synchronize #6043
  • Mar 06 12:15
    cartant edited #6081
  • Mar 06 12:14
    cartant edited #6085
Dorus
@Dorus
You can combine the last 2 calls, if you use mergeMap instead of map, you wont need the mergeMap after.
Or return Observablefrom()
freshdev1
@freshdev1
mapping it. and then want to again return Observable<Bed[]>
Dorus
@Dorus
btw flatmap and mergeMap are identical, it's strange to use both in the same code
mergeMap is the new one you should use, the other is just an allias
freshdev1
@freshdev1
Ok. I didn't know that
how to combine them all to Observable<Bed[]> again after transformation
Dorus
@Dorus
Why even split them?
this.wrcService.getWrcBedsByFilter().pipe(map(beds => beds.map(...))) should be enough right?
if you're not doing anything async inside map, you dont need Rx
freshdev1
@freshdev1
I want to update this value in each :
bed.numberOfBedsArray = Array.from({length: bed.qty}, (v, i) => i + 1);
Dorus
@Dorus
this.wrcService.getWrcBedsByFilter().pipe(map(beds => beds.map(bed => {
  bed.numberOfBedsArray = Array.from({length: bed.qty}, (v, i) => i + 1);
  return bed;
})))
Just that updating bed here is slighly dirty. Would be preferable to make a copy.
freshdev1
@freshdev1
Ok. So you mean I make a copy of the whole array
and then do this?
@Dorus thank you this helped. And it works.
Dorus
@Dorus
:+1:
Daniel Willis
@danww

@Dorus, I think this is what @freshdev1 means:

this.wrcService.getWrcBedsByFilter().pipe(
  map(beds => beds.map(bed => ({
    ...bed,
    numberOfBedsArray: Array.from({length: bed.qty}, (v, i) => i + 1),
  }))),
);

So it returns a new copy of bed, rather the modifying the exisiting one.

freshdev1
@freshdev1
@danww both works fine for me. I used what @Dorus suggested and it got the work done.
Dorus
@Dorus
@freshdev1 Yeah but @danww code avoid modifying the source, so that's a bit cleaner.
freshdev1
@freshdev1
i wanted to modify the source, as this is passed to the template and needs to have this to show the dropdown.
jcapil-ictdu
@jcapil-ictdu
Hi Devs. I would like to ask how to render the string as HTML?
This message was deleted
1 reply
Dorus
@Dorus
@freshdev1 The idea behind RxJs is that you have immutable event sources that you can reuse. You can still build any program you want, you just create new objects instead of modifying the existing ones. This means you map from an immutable source to a new immutable source. This avoids problems once you start multiplexing your sources, and makes your code more reusable. For your current program it probably wont make any difference, but by taking up this style you avoid problems down the road where you might be doing these things.
freshdev1
@freshdev1
@Dorus thanks for the clarification, will keep it noted from now on.
freshdev1
@freshdev1
Guys I have a scenario where I want to read 2 values from Queryparams observable in Angular.
I want to merge them and subscribe so that I get both values in 1 subscribe and then make a call to a webservice
I read merge and combine latest. but both only emits 1 latest value per observable
do you guys know if their is any way of achieving this?
//set id if present
    this.route.queryParams
    .pipe(
      map(param => param['id'])
    )
    .subscribe(paramValue => {
      this.contractId = paramValue;
    });
The same way I need to check for applicationId
but the expectation is to subscribe an observable which gives me the values of both of them collectively like:
var idQueryParamObs =   this.route.queryParams
    .pipe(
      filter(param => param['id'] != null),
      map(param => param['id'])
    );

var applicationIdQueryParamObs = this.route.queryParams
   .pipe(
      filter(param => param[applicationId'] != null),
      map(param => param['applicationId'])
   );
now how to combine and subscribe them?
Daniel Willis
@danww
freshdev1
@freshdev1
@danww first example doesn't describe the problem I mentioned. May be you pasted a wrong URL. :)
The second doesn't run. It keeps showing Connecting to dev server at the bottom after I hit Run this project button.
Daniel Willis
@danww
@freshdev1 Sorry - yes, that was something else; my bad. Here it is: https://stackblitz.com/edit/angular-ivy-zravkz?file=src%2Fapp%2Fapp.component.ts
freshdev1
@freshdev1
Awesome. Integrating it. :smile:
You're a champ. :P
freshdev1
@freshdev1
@danww can you explain a little about why you did not filter in the start and then later filtered out the id and appid?
ngOnInit() {
    this.id$ = this.route.queryParams.pipe(map(params => params.id)); //<---- why no filter here
    this.applicationId$ = this.route.queryParams.pipe(
      filter(params => !!params.appId),                                                                      //<----- but here any intended purpose of this?  
      map(params => params.appId)
    );
    const combinedIds$ = combineLatest([
      this.id$.pipe(filter((id: string) => id !== null)),                                               // and then here
      this.applicationId$.pipe(
        filter((applicationId: string) => applicationId !== null)
      )
    ]);

    this.result$ = combinedIds$.pipe(
      map(([id, applicationId]: [string, string]) => ({
        id,
        applicationId
      }))
    );

    this.result$.subscribe(result => {
      console.log({ result });
    });
  }
}
additionally if you can also explain me to integrate switchMap with this, it would be great. what is a Project function it expects. I am never able to implement it.
    //set id if present
    var idParam = this.route.queryParams
    .pipe(
      filter(params => !!params.id),
      map(params => params.id)
    );

    var applicationParam = this.route.queryParams
    .pipe(
      filter(params => !!params.applicationId),
      map(params => params.applicationId)
    );

    const combined = combineLatest([
      idParam.pipe(filter((id: string) => id !== null)),
      applicationParam.pipe(
        filter((applicationId: string) => applicationId !== null)
      )
    ]).pipe(
      map(([id, applicationId] : [string, string]) => ({
        id,
        applicationId
      }))
    );

    var result = combined.pipe(
      switchMap(result => {

      })
    );

    result.subscribe((contract: TenantContract) => {

    });
I am getting an error in switchMap clause.
freshdev1
@freshdev1
Ok it works as expected. Got it done.
freshdev1
@freshdev1
Thank you for taking out time and suggesting a solution.
Daniel Willis
@danww
@freshdev1 Sorry, I wasn't very consistent with the filters. I guess they should be applied at the earliest opportunity. What are you wanting to do with the switchMap?
freshdev1
@freshdev1
i made a call to the backend to fetch the information based on ID / Application Id which ever is available
I removed the filters altogether. as I wanted them to be null, since one of them or both could be null. in case both are null, I don't make a call, but in other cases I do.
freshdev1
@freshdev1
after I write down the message to you, I realized, its not working if anyone of them is null. :(
Rafael Avaria Gutierrez
@makenoisewacamayo
Hi i got a question regarding piece of code i have, i would like to use concatMap.
this.apiService .getVigencia() .pipe( tap(() => this.getUserSuscriptions()), filter(res => res.vigenciaIva != true) ) .subscribe(
Rafael Avaria Gutierrez
@makenoisewacamayo
 this.apiService
      .getVigencia()
      .pipe(
        tap(() => this.getUserSuscriptions()),
        filter(res => res.vigenciaIva != true)
      )
      .subscribe( // do something)
.......
// the function getUserSubcription() is his own best

getUserSuscriptions() {
    this.apiService
      .getStatus(requestData, this.userRut)
      .pipe(
        tap(res => {
          this.showError =
            Array.isArray(res.servicios) && res.servicios.length === 0;
        }),
        filter(() => this.showError === false)
      )
      .subscribe(
       // process the everything
      )
This is legacy code, but i would like to change using concatMap to call in sequence . I having issues with this for some weird cases.