Deep copying with Object.assign can lead to unexpected issues

I am currently working with an object array that needs to be transformed before it is sent to the controller.

Here is the Angular code snippet I am using:

sourceObjArray: SourceObject[] = [..];
targetObjArray: SourceObject[]= [];
targetObjArray = object.assign(sourceObjArray);
// when i change target object it also causes source object to change
transformSourceObject(targetObjArray)

After some testing, I found a solution that works better:

targetObjArray = object.assign({}, sourceObjArray);
// when i call transform it does not affect source object :)
transformSourceObject(targetObjArray)

However, this new approach has led to a specific issue:

Could not read document: Can not deserialize instance of java.util.ArrayList out of START_OBJECT token at [Source: java.io.PushbackInputStream@302753d0; line: 1, column: 1]; nested exception is com.fasterxml.jackson.databind.JsonMappingException: Can not deserialize instance of java.util.ArrayList out of START_OBJECT token at [Source: java.io.PushbackInputStream@302753d0; line: 1, column: 1]

My controller method signature looks like this:

@RequestMapping(.., method=RequestMethod.POST)
public save(@RequestBody List<Object>, BindResult bindResult){}

Answer №1

While reviewing the post mentioned below, I came across this code snippet which was effective:

Utilizing angular.copy in Angular 2

clonedObject = <YourObjType> JSON.parse(JSON.stringify(originalObject));

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

Entering information into fluctuating object fields

Suppose I have a dynamic object with a union type: data: {[key in 'num' | 'str' | 'obj']: number | string | object}; I set the object properties as follows: data.num = 1; data.str = 'text'; data.obj = {}; E ...

Tips for implementing a filtering function within an array of objects

I am struggling to implement a filter search feature in my ionic mobile application for an array of objects. The array is structured like this: initializeItems() { this.items = [ {Place:"Dumaguete city", date:"February 2 2018"}, {Place:"Sibulan", date: ...

Can you explain how I can showcase JSON object values within an Angular framework?

After fetching data through a REST API in Angular, I need to display only the "classLevelPermissions" in table format as shown in the .html file. .ts - async getclp(className: string) { debugger; this.clplist = []; this.className = className ...

Typescript implementation for a website featuring a single overarching file alongside separate files for each individual webpage

Although I've never ventured into the realm of Typescript before, I am intrigued by its concept of "stricter JS". My knowledge on the subject is currently very limited as I am just starting to experiment with it. Essentially, I have developed my own ...

A detailed guide on preserving session in Angular 4: a step-by-step approach

I am a beginner with Angular 4 and I'm unsure of how to implement session functionality. Can someone please explain the step-by-step process of implementing this feature in Angular 4, including where to write the necessary code? Below is an example co ...

Wallaby.js - The async() test helper requires a Zone to function properly

This project is built with Angular 6.x and tests are conducted using Karma/Jasmine. I'm facing a challenge while using Wallaby where my tests run successfully outside of it, indicating a possible configuration issue. Specifically, when running tests ...

Decoding OData URL parameters in InMemoryWebApi

Struggling to make InMemoryWebApiModule work properly with a custom URL parser for OData. Here is my module configuration: InMemoryWebApiModule.forRoot(MockApiService, { apiBase: 'api/', delay: 0, passThruUnknownUrl: true }), My service looks ...

Youngster listens for guardian's occurrence in Angular 2

While the Angular documentation covers how to listen for child events from parents, my situation is actually the opposite. In my application, I have an 'admin.component' that serves as the layout view for the admin page, including elements such a ...

inject a dynamic loading icon within the choices of a datalist in an Angular application

<input list="dataUsers" formControlName="user" placeholder="Type the user name" class="form-control form-control-lg" type="text" (ngModelChange)="doSearch($event)"/> <datalist id=&q ...

Creating a delayed queue using RxJS Observables can provide a powerful and

Imagine we have a line of true or false statements (we're not using a complicated data structure because we only want to store the order). Statements can be added to the line at any time and pace. An observer will remove items from this line and make ...

What is the best way to pause function execution until a user action is completed within a separate Modal?

I'm currently working on a drink tracking application. Users have the ability to add drinks, but there is also a drink limit feature in place to alert them when they reach their set limit. A modal will pop up with options to cancel or continue adding ...

Issue: "contains method is not supported" in Ionic 2

I'm currently working on a code to validate the contents of my input field, but I've encountered an issue with using the contains function. Here's the TypeScript function I have written: checkFnameFunction(name){ if(name.contains("[a-z ...

Unable to show the data returned from service in Angular 2 component

I am facing an issue with my Angular 2 component that calls a service to retrieve data, but the data is not displaying on the HTML page. It seems that the roots array is coming back as a nested array. I have double-checked both the data and the HTML struct ...

Angular users should be cautious of the 'grid zero width' warning that may arise when employing ag-Grid's sizeColumnsToFit() on multiple ag-Grids simultaneously

I'm encountering an issue with ag-grid where I see the following warning in the console. Despite conducting some research, none of the solutions I found have resolved my problem. It appears that there may be a memory leak within my application based o ...

Typescript: creating index signatures for class properties

Encountering a problem with index signatures while attempting to access static and instantiated class properties dynamically. Despite researching solutions online, I have been unable to resolve the issue. The problem was replicated on a simple class: int ...

ReactJS tweet screenshot capture

Currently seeking a solution to capture a tweet screenshot, store it in a PostgreSQL database, and display it on my ReactJS webpage using Typescript. I have been utilizing react-tweet-embed for displaying the tweet, but now I require a method to save the i ...

The error message "core.js:10101 NG0303: Unable to link to 'matCellDefOf' because it is not a recognized property of 'td'" was displayed on the console

While utilizing Mat table from Angular Material, an error appears in the console as shown in this image: core.js:10101 NG0303: Can't bind to 'matCellDefOf' since it isn't a known property of 'td'. View image description here ...

Combine Typescript files from a dependent module to aid in debugging within a Next.js application

Trying to debug a project written in Typescript using Next.js, but facing issues with bundling TS files from a local dependent common library. Only JS files are included, which is not sufficient for debugging. The goal is to bundle all TS files from the w ...

The quantity of documents queried does not align with the number of data counts retrieved from Firestore

Facing an issue with calculating the Firestore read count as it keeps increasing rapidly even with only around 15 user documents. The count surges by 100 with each page reload and sometimes increases on its own without any action from me. Could this be due ...

Having trouble logging in with Google using React, Redux, and Typescript - encountered an error when attempting to sign in

As a beginner in TS, Redux, and React, I am attempting to incorporate Google Auth into my project. The code seems functional, but upon trying to login, an error appears in the console stating "Login failed." What adjustments should be made to resolve thi ...