invoke the next function a different privateFunction within rxjs

I'm trying to figure out how to pass the resetPassword data to the _confirmToUnlock method in Typescript/RxJS. Here is my subscribe method:

 public invokeUnlockModal() {
   let resetPassword = { userName: this.user?.userName};    //i need to send this to _confirmToUnlock method
      this.infoModal.componentInstance.emitUserOp
                     .subscribe({ next: this._confirmToUnlock });
  }

This method is called when needed:

    private _confirmToUnlock = async (response: { opStatus: string }) => {
        
      if (response.opStatus.toLowerCase() === 'confirmed') {
          
//  let resultObs= this.dataService.unlockUser(resetPassword);
  //let result= await resultObs.toPromise();
         }
      }

If anyone has any ideas on how I can achieve this, please let me know.

Answer №1

I'm not really familiar with this specific Modal definition, but if it involves a simple callback, you can try using an arrow function to pass arguments.

You can attempt the following approach:

public openUnlockModal() {
  let passwordReset = { username: this.user?.username };
    this.infoModal.componentInstance.emitUserOp.subscribe({ 
      next: (response: any) => this._confirmUnlock(response, passwordReset)
    });
}

private _confirmUnlock = async (response: { status: string }, passwordReset: any) => {
  // utilize `passwordReset` here
  if (response.status.toLowerCase() === 'confirmed') {
  }
}

Furthermore, I recommend avoiding mixing Promises and Observables in your code as it can make maintenance challenging. It's best to either convert everything to Observables or vice versa.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using async await with Angular's http get

In my service component, I have the following code snippet that retrieves data from an API: async getIngredientsByProductSubCategory(productSubCategoryId: number) { const url = '/my-url'; let dataToReturn: any; await this.http.get(ur ...

Guide to deploying Angular application on a weblogic server using a WAR/EAR file

I am facing difficulties deploying an Angular application on a WeblogicApplication server. My current approach is not yielding successful results: This is what I have done: 1) Built my Angular application using exec-maven-plugin and placed the result i ...

Steps for aligning the upper rectangular text in the center of the larger rectangular border

https://i.stack.imgur.com/7yr5V.png I was aware of a particular element in html that had text positioned in the upper left corner, but my knowledge didn't go beyond that. Should I be adjusting the translation on both the X and Y axes based on the par ...

Issue with the close button on ngb-alert not functioning properly

As I develop my website, I have incorporated an ngb-alert component to display an alert message to users upon login. While the alert itself is functioning properly, I have encountered an issue with the close button being misaligned, and I am struggling to ...

Having trouble retrieving a specific key from the state object in Redux using TypeScript

I have incorporated TypeScript into my Ionic project, using React hooks. I recently added an errorReducer to handle any errors that may arise from the server. Below is a snippet of my code: Action import { ERROR_OCCURRED } from "./types"; ...

defining data types based on specific conditions within an object {typescript}

Can someone help with implementing conditional function typing in an object? let obj = { function myfunc (input: string): number; function myfunc (input: number): string; myfunc: function (input: string|number):string|number { ... } } I've been ...

Guide to simulating Twilio with Jest and TypeScript to perform unit testing

Please assist me in mocking a Twilio service that sends messages using Jest to mock the service. Below is the code I am working with: import { SQSEvent } from "aws-lambda"; import { GetSecretValueResponse } from "aws-sdk/clients/secretsmanag ...

In which situations is it required to specify the return type of a function in TypeScript?

When it comes to making functions in typescript, the language can often infer the return type automatically. Take for instance this basic function: function calculateProduct(x: number, y: number) { return x * y; } However, there are scenarios where dec ...

TypeScript issue encountered with parseInt() function when used with a numeric value

The functionality of the JavaScript function parseInt allows for the coercion of a specified parameter into an integer, regardless of whether that parameter is originally a string, float number, or another type. While in JavaScript, performing parseInt(1. ...

Exploring Angular 10's advanced forms: delving into three levels of nested form groups combined with

Project Link: Click here to view the project In my testForm, I have 3 levels of formGroup, with the last formGroup being an array of formGroups. I am trying to enable the price field when a checkbox is clicked. I am unsure how to access the price contro ...

The function RegisterOnChange is not a valid function

I utilized FormBuilder(fb) to create this form. this.serviceRecordForm = this.fb.group({ client: [], serviceRecordItem: this.fb.group({ productStatus: [''], password: [''], hasBackup: ...

In TypeScript, this regular expression dialect does not permit the use of category shorthand

Recently, I attempted to implement a regular expression in TypeScript: I ran the following code: const pass = /^[\pL\pM\pN_-]+$/u.test(control.value) || !control.value; To my surprise, an error occurred: "Category shorthand not allowed in ...

"Learn the process of distinguishing between a drop-down value and a selected value within a drop-down menu using angular2-multiselect

I need assistance with a requirement involving a multi-select drop-down menu where the values are in the format of "Code - Name". When an option is selected from the drop-down, only the "Code" should be displayed. I am currently using angular2-multiselec ...

What is the best way to transfer data received from an observable function to use as an input for another observable function?

After carefully declaring all the variables, I am facing an issue with passing the value obtained from the first observable function (this.acNum) as a parameter to resolve the second observable function within the ngOnInit method. Despite displaying correc ...

Having issues with referencing external JavaScript and CSS files in Angular 6

Dealing with an angular6 project and a bootstrap admin dashboard template, I'm facing issues importing the external js references into my Angular application. Looking for guidance on how to properly import and refer to external Js/CSS files in an angu ...

Is it necessary for an Angular service's query method to return an error when it doesn't find any

Let's say I create a service that includes a method called getProducts When using this service, it looks something like this this.service.getProducts('someProduct').subscribe(product => {}, err => {}); If the product with the name & ...

Utilizing props in styled-components: A beginner's guide

I am trying to pass a URL to a component so that I can use it as the background image of the component. Additionally, I need to check if the URL is empty. Component: <BannerImg/> CSS (styled): `const BannerImg = styled.img` background-image: url( ...

Why isn't the Angular2 ngIf directive updating the DOM?

I am encountering issues with finding the right expression for ngIf to evaluate properly. After following a basic Angularfire2 example, I have successfully managed to log in and out. import { Component } from '@angular/core'; import { AngularFi ...

An error occurred as the Serverless Function timed out while attempting to load a dynamic route in Next.js version 13

I have a basic Next.js application with the following route structure: /contentA/ - Static - Initial load: 103 kB /contentA/[paramA]/groups - SSG - Initial load: 120 kB /contentB/[paramA]/[paramB]/[paramC] - SSR (client component) - Initial load: 103 kB ...

Steps for opening standalone angular2 and TypeScript project in visual studio: A guide to launching your project

What is the process for accessing an Angular2 and TypeScript project in Visual Studio without needing npm or Node.js? I require the ability to open the project on a computer that is not connected to a network. Many thanks ...