CODEWITHSUNDEEP
angularrxjs
user6680
user6680

Reputation: 139

Switchmap returning single characters - Angular

I'm trying to return a value from a switchmap if a condition is met, but it's returning the console.log broken up in single characters. So if role comes back as Buyer, then it comes back as 

console.log("RES");
console.log(res);

outputs

RES
B
RES
u
RES
y
RES
e
RES
r

How can I return the value intact from the subscribe()? I don't really understand why it breaks it up. I appreciate any help!

invite component.ts

...
   const linkExpiredDate = new Date(date);
          const invite = new SendInvite();
          invite.inviteEmail = form.value.email;
          invite.invitedBy = this.userId;
          invite.inviteLinkExpirationDate = linkExpiredDate;

          this.inviteService
            .sendInvite(invite)
            .pipe(takeUntil(this.destroy))
            .subscribe(
              res => {

                console.log("RES");
                console.log(res);

                this.timeout = this.toastr.success("Invite sent!", "", {
                  timeOut: 2000
                });

                this.invites.push({
                  inviteEmail: form.value.email,
                  invitedBy: this.userId,
                  inviteDate: Date.now()
                });

                this.dataSource.data = this.invites;
              },
              error => {

                console.log(error)
                this.timeout = this.toastr.warning(
                  "This user is already a member!",
                  "",
                  {
                    timeOut: 2000
                  }
                );
                return;
              }
            );
        }

invite service.ts

 sendInvite(inviteRequest: SendInvite) {
    console.log("INVITED BY" + inviteRequest.invitedBy);
    const invite: SendInvite = {
      id: null,
      inviteEmail: inviteRequest.inviteEmail,
      invitedBy: inviteRequest.invitedBy,
      inviteLinkExpirationDate: inviteRequest.inviteLinkExpirationDate
    };
    return this.validateEmail(invite.inviteEmail).pipe(
      switchMap(emails => {

        if (emails.message === "User found" && emails.role === "Artist") {
          this.toastr.warning("User already has a Seller Account", "", {
            timeOut: 6000
          });
          return emails.role;
        }
        if (emails.message === "User found" && emails.role === "Buyer") {
          this.toastr.warning("User already has a Buyer Account. Use different email or upgrade Buyer Account", "", {
            timeOut: 6000
          });
          return emails.role;
        } else {
          console.log("EMAIL MESSAGE " + emails.message);

          console.log("USER NOT FOUND!");
          return this.http.post<{
            messageId: string;
            inviteId: string;
            creator: string;
          }>(environment.azure_function_url + "/POST-Artist-Invites", invite);
        }
      })
    );
  }

Upvotes: 2

Views: 735

Answers (1)

ggradnig
ggradnig

Reputation: 14149

You're returning a string inside your switchMap function. A string is an array of characters. RxJS treats arrays as streams of events (sometimes with operators like switchMap, more specifically everywhere where you can pass ObservableLike). So what you get is a stream of character events that is merged into your outer observable. Thus your console output.

I guess what you probably want is to wrap your emails.role into an of operator, so you get return of(emails.role).

of emits a single event with the value that you give it instead of trying to interpret the value as an Observable stream.

Upvotes: 6

Related Questions