Tips for sending an array containing objects with an ID using Angular

Can you give me your thoughts on how to post an array with some object?

This is the code I am working with:

 const selectedJobs = this.ms.selectedItems;
    if (!selectedJobs) {
      return;
    }
    const selectedJobsId = selectedJobs.map((jobsId) =>
      jobsId.id
    );

In this scenario, I retrieve all job IDs as an array ['618e2ee9', '3ee199b7']

    const payload = [
      {
        jobId: selectedJobsId,
        state: 2,
      }
    ];

The payload gives me an array containing one object that includes an array of job IDs and a state. As shown below

 [
    {
        "jobId": [
            "618e2ee9",
            "3ee199b7"
        ],
     "state": 2
    }
]

I need the response to be one array with separate objects for each job ID:

[
    {
       "jobId": "618e2ee9",
        "state": 2
    },
    {
      "jobId":  "3ee199b7",
    "state": 2
    }
 ]

If you have any ideas, please share them!

Answer №1

Give this a shot

    let newData = updatedIds.map(id =>
                        {
                            return {id: id, status: 1};
                        });

Answer №2

create a new array called chosenPositions by iterating over the selectedJobs array and returning an object with the jobId and state of each job.

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

The interface 'HTMLIonIconElement' is not able to extend both 'IonIcon' and 'HTMLStencilElement' types at the same time

After upgrading my Angular Ionic app to use Angular v13 from Angular 12 with the command ng update, I encountered errors preventing me from running the application successfully. [ng] Error: node_modules/ionicons/dist/types/components.d.ts:66:15 - error TS2 ...

Azure Static Web App does not retrieve the connection string value from environment.prod.ts

After deploying my Angular App to Azure as a Static Web App, everything seemed to be running smoothly. However, I encountered an issue with the file "environment.prod.ts" in the environments folder within my app that contains the following code: export co ...

Is there a way to compile Node's global modules and objects using TypeScript while having the checkJs option enabled?

By including "checkJs": true in my tsconfig.json file, Node's global paths and objects are marked as "not found". For example, if I were to write: import path from "path"; const p = path.resolve(__dirname, 'dist/js') The TypeScript co ...

I'm encountering issues with undefined parameters in my component while using generateStaticParams in Next.js 13. What is the correct way to pass them

Hey there, I'm currently utilizing the App router from nextjs 13 along with typescript. My aim is to create dynamic pages and generate their paths using generateStaticParams(). While the generateStaticParams() function appears to be functioning corre ...

How can I effectively utilize the Angular router to share routes among various named outlets?

My application requires displaying the same components or routes in multiple areas of the interface. This means allowing users to show certain components in various locations based on their selection, such as side panels or bottom right panels. In my situ ...

An error occurred: The property 'toUpperCase' cannot be read of an undefined Observable in an uncaught TypeError

Encountering an issue during the development of a mobile app using the ionic framework for a movie application. After finding an example on Github, I attempted to integrate certain functions and designs into my project. The problem arises with the 'S ...

Angular encountered an error when trying to access the property "fruits" of an undefined object

When working with Angular, I encountered an issue where I received the error message "cannot read property 'fruits' of undefined." Within my class definition, I have included the following: export class MyClass implements OnInit { fruits: any[] ...

When retrieving keys and values from an associative array in PHP, it will not return all keys and values if they have the same key name

Currently, I am analyzing a file with the following data: Vélez Sarsfield|Zárate, Mauro|8|0|0|1|9 Estudiantes|Carrillo, Guido|5|1|0|2|8 Boca Juniors|Gigliotti, Emanuel|3|2|0|2|7 River Plate|Carbonero, Carlos Mario|4|2|0|0|6 Arsenal|Echeverría, Mariano|6 ...

New approach in Typescript: Enhancement of child class with additional Event Listener overloads

One of my classes is structured like this: interface A extends EventEmitter{ on(event: "eventA", listener: () => void): this; } There is another class defined as follows: interface B extends A{ on(event: "eventB", listener: ...

What is the best way to distinguish shared services from other services in Angular 6 and above?

There was a time when I frequently heard the term "shared services" in relation to sharing data between unrelated components in Angular. However, I started questioning whether every service is actually classified as a shared service or not. If it is cons ...

Update AngularJS from version 1.2.6 to Angular 16 in order to resolve the Material issue

Currently, I am working on a project that involves upgrading AngularJS version 1.2.6 to Angular 16. However, I have encountered a significant challenge in understanding the variances between AngularJS material and Angular material. For example, in Angular ...

Interacting Angular 4 Modules communicate with one another

If I have two modules, one for Customers and one for Orders, structured like this: /customers /customers-list.component.html /customers-list.component.ts /customers-details.component.html /customers-details.component.ts /customers-crea ...

Obtain the specific key and its corresponding value using Angular

I am seeking assistance on how to extract a specific key and its value from an object. {RuleExpression: 'DEFAULTS.epHDefaults.gen== true', Action: Array(0), DefaultActions: Array(3)} Action: [] DefaultActions: (3) [{…}, {…}, {…} ...

"Troubleshooting issue: Vue deep watch failing to detect changes in object properties

My initial data consists of a `customer` object. As I input text into various fields, different keys are added to the object. The watcher function triggers properly when a new key is added, but if an existing key is edited with a new value, the watcher doe ...

How can we organize an array with timestamps as keys in descending order?

Can the krsort() function effectively sort an array with timestamp keys in reverse order? Are there any other commonly used functions for achieving this type of sorting? $arr = array(); $arr[1327305600] = '87718'; $arr[1327132800] = '87798& ...

Ionic 2 encountering issue with `ctorParameters.map` not being a function error

Recently, I wanted to incorporate the Network-information plugin into my project but encountered compatibility issues with an older version of Ionic-native. To resolve this, I took the following steps: npm rm --save ionic native npm install --save ionic-n ...

Refused to run script from inline content on the lightweight server due to security policy restrictions

I have been adhering to Angular's best practices in order to create a Progressive Web App (PWA). After building the production version (ng build --prod --aot), I am running it from the dist folder on localhost using npm run dev ("dev": "lite-server"). ...

What is the best way to iterate through an array and make use of index values while removing any empty elements along the

In my current setup, I have defined two arrays keyVals and rows: keyVals = [ "Status", "ErrorHeading", "ErrorDetail" ] rows = [ { "Hostname": "ABC", "name& ...

What is the process for integrating unit tests from external sources into an Angular project following an upgrade to version 15

As of Angular v15, the require.context function has been removed from the test.ts configuration file. I used to rely on require.context to expose tests outside of the Angular project to Karma. Now that it's no longer available: const contextGlobal = ...

Eliminate redundant arrays across several JSON files with Python

I have a collection of JSON data records such as { "Stat": "DEN", "Change": [{ "From": "", "To": "DEN", "changeTimestamp": "202 ...