A new reference is created when Angular.copy is used

Whenever I attempt to duplicate a new object into an old object using angular.copy, the reference changes. If I try using = or

JSON.parse(JSON.stringify(newObj))
, the view does not reflect the new value.

Is there a solution to this issue?

Here is a code example:

$scope.value = newValue.ref;

In this case, the view does not update.

$scope.value = angular.copy(newValue.ref);

When doing this, the view updates, but the reference changes.

Answer №1

If you want to maintain the reference, make sure to use the two-argument version of angular.copy:

//$scope.value = angular.copy(newValue.ref);

//Make sure to use the two-argument format
angular.copy(newValue.ref, $scope.value);

By doing this, you can ensure that the original reference is retained.

How to Use

angular.copy(source, [destination]);

This function creates a deep copy of the source, which should be an object or an array.

  • If a destination is specified, all of its elements (for arrays) or properties (for objects) will be removed before copying over the elements/properties from the source.

— AngularJS angular.copy API Reference

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

What is the best way to utilize the request information within the app directory, similar to how it is done with the getServerSide

I am looking for a way to access the request data in my component. I have looked through the documentation but haven't been able to find a solution yet. If it's not possible to see the request data directly, are there any alternative methods I c ...

Click on the email link to access the AngularJs application

Seeking advice from those who have experience with similar applications. I am currently developing an online testing app. For instance, HR professionals can create test sessions for job applicants and send them a link to access the app. Upon clicking the ...

Exploring the depths of nested objects within my Rails JSON data structure

I am looking to structure a nested JSON format for my Event model that resembles the following: "event": { "quiz": { "name": "", "desc": "", "events": [ { "name": "general quiz", "desc": "" }] }, "dance": { "name": "", ...

Understanding the Typescript Type for a JSON Schema Object

When working with JSON-schema objects in typescript, is there a specific type that should be associated with them? I currently have a method within my class that validates whether its members adhere to the dynamic json schema schema. This is how I am doing ...

Using Vue/Nuxt.js to compute the cumulative sum of hierarchically structured JSON data

When using Nuxt async data, I am retrieving a JSON object that includes a nested array in the following structure: "topic_list": { "topics": [ { "id": 9148, "title": "A", "views": 12 }, { "id": 3228, ...

Implementing OAuth2 in a Microservices architecture to establish a user account

In my current setup, I am utilizing a React Application along with a separate Express API. My goal is to allow users to register through my React app. To do this, I believe the oauth2 flows should follow these steps: Prompt the user for information (suc ...

Selenium in Perl: Facing a puzzling JavaScript error while attempting to resize window

Utilizing the Perl Selenium package known as WWW::Selenium, I have encountered a perplexing JavaScript error while attempting to resize the browser window. The error message reads: "Threw an exception: missing ; before statement". Below is the code snippe ...

React - Render an element to display two neighboring <tr> tags

I'm in the process of creating a table where each row is immediately followed by an "expander" row that is initially hidden. The goal is to have clicking on any row toggle the visibility of the next row. To me, it makes sense to consider these row pa ...

The code to assign a value to "parentId1" using window.opener.document.getElementById is malfunctioning

Trying to retrieve the value from my child.jsp and pass it to my parent.jsp using window.opener.document.getElementById("parentId1").value = myvalue; Despite no errors appearing in the console, the value is not successfully transferring to the parent pag ...

Using jQuery/Javascript to create a dynamic content slider

I am currently working on developing a straightforward content slider. When the page loads, my goal is to display only one item (including an image and some content) and provide a navigation system for users to move through the items. Below is the basic H ...

How can one use an ajax call to delete rows from a table and then add new rows in their

Hey everyone, I'm looking to make an AJAX call and when it's successful, I want to remove all existing elements in my table and replace them with new ones based on the returned data. This is the method I have for making the AJAX call: $(document ...

What steps should I take to resolve npm start issues within my Node.js application?

Upon completing the npm install, I attempted to run npm start for my project. Unfortunately, an error was displayed. What steps can be taken to resolve this issue?view image of the error here ...

Filtering JSON data in AngularJS is simple and effective

I am working with JSON data and I want to display it filtered by genre. The solution provided in the previous question How to filter JSON-Data with AngularJs? did not work for me. Here is myapp.js: var myApp = angular.module('myApp', []); myAp ...

Tips for making the background image fit perfectly within a div element

I have a calendar div that I want to customize with a background image and text. How can I achieve this? https://i.sstatic.net/hVQm2.jpg Here is my code: .calenderArrivalDiv{ margin-top: 15%; margin-bottom: 1%; ...

Working with time durations in JavaScript

Is there a way to calculate the duration between a start time and an end time including both hours and minutes? Currently, I have code that only provides me with the hours. Is there any modification I can make to include minutes as well? If so, what chan ...

How can we develop a NodeJS function that returns a query result using a callback method?

I'm currently working on verifying the proper operation of a database using mocha/chai in NodeJS. I am looking for a solution to run a SQL query and then validate its execution. The issue I'm facing is that when I reach the assertion, the result ...

Troubleshooting: Success with AJAX call in Chrome, but issues in IE

Having issues retrieving JSON data from a URL that displays the last 3 numbers of a webpage. The AJAX call functions correctly in Google Chrome but fails in Internet Explorer. I tried disabling caching using cache: false as suggested, but the problem persi ...

My attempts to parse data from multiple JSON files at once proved to be unsuccessful

I am receiving JSON data from the server, but I am having trouble parsing more than one JSON at a time. When multiple JSON responses are received simultaneously, my parser fails to deserialize them correctly. How can I address this issue? Update: For exa ...

Display the data count of a filtered list in Vue 2

As a newcomer to Vue, I am facing what seems like a simple and common task but the solution is escaping me. I need to filter some data and then display the count in a component. This is the HTML structure: <main class="container-fluid"> <div ...

Using npm link with Webpack results in eslint errors

I have a multi-package project setup, where I have one JavaScript package that depends on a TypeScript library. Initially, I was using Sinopia and had to reinstall the TypeScript library every time I made changes to it. Then I discovered npm link and thoug ...