Building an array from scratch in Angular

Below is the URL to access the code:

https://stackblitz.com/edit/ng-zorro-antd-start-xz4c93

Inquiring about creating a new array. For example, upon clicking the submit button, the desired output should resemble the following structure:

"tasks": [
    {
      "id": "HmQiCcZUXbSF",
      "failed": false,
      "remarks": "Ok",
      "task": {
        "id": "1fKBO4w0XHg7H",
        "name": "Task 1",
        "description": "Check oil spill"
      }
    },
    {
      "id": "1qK7AUzgEbqBH",
      "failed": false,
      "remarks": "Ok",
      "task": {
        "id": "ESOSA6aCrOER",
        "name": "Sample1",
        "description": "Desc1"
      }
    }
  ],

The expected output matches the above format.

My current output can be viewed here: https://i.sstatic.net/YkJDm.png

It should resemble that of Postman communication.

{
  "id": "1foNLPYHsSmVv",
  "createdBy": "admin",
  "timeCreated": "2019-12-16 12:47:56",
  "updatedBy": "admin",
  "timeUpdated": "2019-12-16 12:47:56",
  "remarks": "All is fine",
  "tasks": [
    {
      "id": "w1lPuzJIDouF",
      "failed": false,
      "remarks": "Ok",
      "task": {
        "id": "1fKBO4w0XHg7H",
        "name": "Task 1",
        "description": "Check oil spill"
      }
    },
    {
      "id": "1foD7MW0rRDdH",
      "failed": false,
      "remarks": "Ok",
      "task": {
        "id": "ESOSA6aCrOER",
        "name": "Sample1",
        "description": "Desc1"
      }
    }
  ]
}

Answer №1

If your sole requirement is to retrieve the task as the output, you can achieve it using the following code snippet.

async fetchTaskData() {
  const requestObject = {
    tasks: this.taskFormGroup.value.remark.tasks
  }
  console.log(requestObject)
}

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

Modify a property within an object stored in an array using React with Redux

When trying to dispatch an action that updates values in the redux state by passing an array, I encountered an issue. It seems that despite attempting to update the array by changing object values, I kept facing this error - "Cannot assign to read only pro ...

`Is There a Solution When Compilation Fails?`

I keep encountering an issue when I run the command npm start. The problem seems to be originating from PancakeSwap Frontend and after several attempts, I am still unable to resolve it. Your assistance is greatly appreciated :) Below is a snippet of my Ap ...

Using AJAX, retrieve the attribute of a button and assign it to a node

I'm currently facing a dilemma in trying to pass the name of a clicked button to my node server. I have this code snippet in Node.js: app.get('/someUrl', function(req, res) { console.log(req.body.name); }); Meanwhile, my jQuery/ajax ...

Is it secure to store information that impacts component rendering within a JWT payload?

I am currently developing a MERN app where users have various roles, and different components are rendered based on their role in React. In my application, I store a JWT containing the user's ID and role in a cookie, which is then decoded in a global ...

Issue with JQuery Ajax call within If condition

My Ajax call is working perfectly in one scenario, but not in another when placed inside an if statement. I'm relatively new to JS and Ajax, so I may be missing something fundamental. Any insights would be appreciated. Thank you. The function that wo ...

Jasmine tests for AngularJS directive failed to invoke the link function

I can't figure out why the link function of my directive isn't being called in a Jasmine test. I've created a simple example to illustrate. Here is the code for my directive (TestDirective.js): 'use strict'; angular.module(&ap ...

Using ng-checked directive with a radio button in AngularJS

Within my angular application, I have implemented a loop to iterate through a collection and display the records using input type="radio". <tr ng-repeat="account in vm.pagedAccounts.items" ng-class="{ 'highlight': (account.row ...

PHP and MySQL combination for efficient removal of multiple dropdown choices

I'm struggling to figure this out. Essentially, it's a form with multiple dropdown menus where users can select one or more items to filter MySQL data results. I want to dynamically update the other dropdown menus as the user makes selections. Fo ...

Error message: An unhandled TypeError occurs when attempting to access properties of an undefined object (specifically, the 'then' property) while refreshing the token using axios

Is there a way to refresh tokens in axios without interrupting the flow? For example, when the server returns an access token expiration error, I want to queue the request and replay it after getting a new token. In React, I'm using promises as shown ...

The error "Unable to create an instance of mssql.Schema" indicates that the

Seeking assistance from experienced ReactJS developers to address the issue outlined below. The code provided is based on a tutorial I was following. Despite numerous attempts, I have been unable to resolve the issue. Here is the code snippet from User.js ...

Exploring methods to conduct testing on an AngularJS application using AngularJS end-to-end testing, specifically focusing on scenarios involving multiple inputs

Our program includes a directive that is repeated multiple times with an input field. The structure of our code resembles the following: <li> <label>AMI</label> <div class="searchbox" searchbox="" filter="search.ami"> ...

In order to ensure functionality on Firefox 3 and Opera, it is essential to include multiple <script> tags and the <!-- //required for FF3 and

I have utilized Spring Roo to create a basic web project. The user interface is JSP-based with a Tiles layout. Upon examining the default layout code, I noticed that the script tags were defined as: <script src="${dojo_url}" type="text/javascript" > ...

Transform static borders into mesmerizing animations by changing the solid lines to dotted lines using CSS

I've managed to create a circle animation that is working well, but now I'm looking to switch from solid lines to dotted lines. Can anyone provide guidance on how to accomplish this? Here is the current appearance: #loading { width: 50px; ...

Module 'prompt-sync' not found

When attempting to take user input in Node.js using the prompt module, I encountered the following error message: node:internal/modules/cjs/loader:998 throw err; ^ Error: Cannot find module 'prompt-sync' Require stack: - D:\Code\C+ ...

How to implement automatic clicking using Material Angular components

Looking to incorporate layout tabs from Angular Material into my project: https://material.angular.io/components/tabs/overview Interested in implementing auto-click functionality - how can I instruct Angular to simulate clicking on the "Tab1" link, waiti ...

Exchange data using socket.io in nodejs and express with a different javascript file

Imagine having a JavaScript file that needs to interact with another JavaScript file in order to share data between them. For instance, let's consider a file named game_server.js. Within this file, there are two variables that we want to access in th ...

Ways to extract the coordinates for slices positioned around the circumference of a pie chart

Currently, I am working on designing a pie chart with D3 using d3.layout.pie(). The image resembles the one displayed below, but without the black dots. These dots were added manually in Photoshop to highlight an issue that I am facing. I am curious about ...

Reveal the administrator's details exclusively when the associated radio button is chosen

Managing administrators for a post can be done through an editing page with corresponding radio buttons. Each radio button is linked to a different administrator, and selecting one populates the form fields with that admin's details. The issue arises ...

JavaScript - Two tables shown in parallel

Beginner coder seeking assistance! I am currently working on an application with two user input fields placed adjacent to each other. Clicking parse buttons next to these fields generates two separate tables. However, I need these tables to be displayed si ...

How to open a link in the URL bar of Safari on iOS using JavaScript

My goal is to open a link through the iOS Safari address or URL bar. After testing, I have found that in newer iOS versions, the address bar no longer executes javascript:alert("hi"); as it did before. Have any new methods been introduced, or h ...