Another return payload failing to retrieve the return value

Question

Another return payload failing to retrieve the return value

I'm currently facing an issue where a function that should return a value is not being passed on to another function. Below is the code snippet in question:

public _getProfileToUpdate() {
  return {
    corporateId: this.storeService.setStoreData().profile.preferred_username[1],
    id: this.storeService.setStoreData().profile.sub,
    firstName: this.userFormGroup.controls.firstName.value,
    lastName: this.userFormGroup.controls.lastName.value,
    email: this.userFormGroup.controls.email.value,
    mobile: this.userFormGroup.controls.mobile.value,
    workNumber: this.userFormGroup.controls.workNumber.value,
    roleId: this.sortRoleId()
  };
}

sortRoleId() {
  this._contentService._getRoles().subscribe((resp) => {
    const search = this.storeService.setStoreData().profile.role;
    const index = Object.values(resp.roles).indexOf(search);
    const result = Object.keys(resp.roles)[index];
    return result;
  })
}

I am trying to send the "result" value to the "roleId" field in the other function, but it seems to be returning as undefined.

javascript angular typescript

Answer 1

Answer №1

Give this a shot:

function fetchProfileToUpdate() {
    // Call the service
    this._contentService.fetchRoles().subscribe((response) => {
        const searchQuery = this.storeService.updateStoreData().profile.role;
        const index = Object.values(response.roles).indexOf(searchQuery);
        const key = Object.keys(response.roles)[index];
        
        // Prepare and return object
        return {
            corporateId: this.storeService.updateStoreData().profile.preferred_username[1],
            id: this.storeService.updateStoreData().profile.sub,
            firstName: this.userFormGroup.controls.firstName.value,
            lastName: this.userFormGroup.controls.lastName.value,
            email: this.userFormGroup.controls.email.value,
            mobile: this.userFormGroup.controls.mobile.value,
            workNumber: this.userFormGroup.controls.workNumber.value,
            roleId: key
        };
    })
}

Answer 2

Give this a shot:

function fetchProfileToUpdate() {
    // Call the service
    this._contentService.fetchRoles().subscribe((response) => {
        const searchQuery = this.storeService.updateStoreData().profile.role;
        const index = Object.values(response.roles).indexOf(searchQuery);
        const key = Object.keys(response.roles)[index];
        
        // Prepare and return object
        return {
            corporateId: this.storeService.updateStoreData().profile.preferred_username[1],
            id: this.storeService.updateStoreData().profile.sub,
            firstName: this.userFormGroup.controls.firstName.value,
            lastName: this.userFormGroup.controls.lastName.value,
            email: this.userFormGroup.controls.email.value,
            mobile: this.userFormGroup.controls.mobile.value,
            workNumber: this.userFormGroup.controls.workNumber.value,
            roleId: key
        };
    })
}

Answer 3

Answer №2

To efficiently manage the subscription to the content service, consider subscribing in your ngOnInit method or adjust the calling hierarchy of your methods like this:

profile = {};
public _getProfileToUpdate() {
this._contentService._getRoles().subscribe((resp) => {
const search = this.storeService.setStoreData().profile.role;
const index = Object.values(resp.roles).indexOf(search);
const result = Object.keys(resp.roles)[index];
// Return object
this.profile = {
corporateId: this.storeService.setStoreData().profile.preferred_username[1],
id: this.storeService.setStoreData().profile.sub,
firstName: this.userFormGroup.controls.firstName.value,
lastName: this.userFormGroup.controls.lastName.value,
email: this.userFormGroup.controls.email.value,
mobile: this.userFormGroup.controls.mobile.value,
workNumber: this.userFormGroup.controls.workNumber.value,
roleId: result
};
})
}

Handle the variable within your form or application, and Angular will automatically trigger the necessary functions to process updated information.

Answer 4

To efficiently manage the subscription to the content service, consider subscribing in your ngOnInit method or adjust the calling hierarchy of your methods like this:

profile = {};
public _getProfileToUpdate() {
this._contentService._getRoles().subscribe((resp) => {
const search = this.storeService.setStoreData().profile.role;
const index = Object.values(resp.roles).indexOf(search);
const result = Object.keys(resp.roles)[index];
// Return object
this.profile = {
corporateId: this.storeService.setStoreData().profile.preferred_username[1],
id: this.storeService.setStoreData().profile.sub,
firstName: this.userFormGroup.controls.firstName.value,
lastName: this.userFormGroup.controls.lastName.value,
email: this.userFormGroup.controls.email.value,
mobile: this.userFormGroup.controls.mobile.value,
workNumber: this.userFormGroup.controls.workNumber.value,
roleId: result
};
})
}

Handle the variable within your form or application, and Angular will automatically trigger the necessary functions to process updated information.

Another return payload failing to retrieve the return value

Answer №1

Answer №2

Similar questions

Issue encountered while retrieving value from asynchronous dns.lookup() function

How can I use JQuery to enable or disable checkboxes upon loading?

Informing Typescript that a variable has already been null-checked

Guide on transmitting data from a child component to a parent object in Vue.js?

What is the best way to send the selected option from a dropdown to a button click function within the controller?

What is the best way to divide a string that contains n concatenated JSON strings in JavaScript or Node.js?

Managing the response from a variable returned by jQuery's .load method

Encountered a style group error 'non-collision' while using Angular with HERE Maps JS API 3.1

Merge JSON object information into tables, including column headings

Use PHP to highlight the row that has been selected in an HTML table

Problem with sending variable via AJAX

The tooltip menu options in material ui are displaying in a different location in the window rather than below the button icon. How can this issue be resolved?

Exploring various components within a JavaScript array

Abrupt surge in Firestore read operations detected in Next.js application following a period of no modifications - refer to the accompanying visual

Reorganizing an array using a custom prioritized list

Is it possible that Angular2 is unable to properly establish the default value when it is selected?

Is there a way to alter the text color using JavaScript on the client side?

Creating visual content on Canvas using JavaScript

Creating a JavaScript function using jQuery to calculate the total sum of textboxes with two specified classes

Parsing JSON sub items in Android application using Java