Changing keys of Angular data objects

I feel like I'm overlooking a simple solution.

Within my $scope, I have an object. Now, I want to rename one of its properties.

Let's say I currently have:

$scope.data = { prop1: value1, prop2: value2}

My goal is for the object to look like this:

$scope.data = { newProp: value1, prop2: value2}

I attempted:

$scope.data.prop1 = newProp;
delete $scope.data.prop1;

Unfortunately, I did not achieve the desired result.

How can I correctly update an Angular data object in this scenario?

Thank you

UPDATE

Additional information:

I tried updating this object from a child controller using $scope.$parent.data

javascriptangularjs

Answer №1

It appears that you were referring to the following solution:

$scope.details.updatedValue = $scope.data.value1;
delete $scope.data.value1;

CodePen example

Answer №2

Consider restructuring the entire object.

Feel free to try out the following code snippet:

$scope.data = { prop1: value1, prop2: value2}

$scope.data1 = {
    newProp : $scope.data.prop1,
    prop2: $scope.data.prop2
} 
$scope.data = $scope.data1;
console.log($scope.data);

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 ensure the execution of requests within async.each in nodejs?

I am facing an issue with my code that uses async.each to iterate through an array and execute a function called "check" for each element. The check function contains a request, but when I run the code, I find that Node.js is not executing the check functi ...

javascriptnode.jsforeachasync.jsrequestjs

Code working in Chrome but not in Firefox: JavaScript hyperlink issue

Within my Rails project, an HTML file displays the following: <a href='#' id="show_advanced">Show advanced options</a> Upon clicking on the link, JavaScript/JQuery code is executed: jQuery("#show_advanced").click(function() { // ...

javascripthtmlruby-on-rails-3

Customizing the marker size in Angular OpenLayers

Is there a way to adjust the size of a custom icon image for markers? For example, if I specify the size within the style like this: style: { image: { icon: { anchor: [0.5, 0.5], anchorXUnits: 'fraction', ...

angularjsopenlayers-3angular-openlayers

Enable vertical scrolling on the second row of a table while keeping the first row fixed as the table header (CSS)

While embedding the Ace Editor in a Chrome popup window, I encountered a challenge. My goal was to keep the first row of text always visible at the top while allowing the rest of the Editor to fill the screen. However, there is an issue with a vertical scr ...

javascripthtmlcssace-editor

Display or conceal several elements using JQUERY/HTML upon hovering

Here is the current progress: <div style="position: relative;"> <a href="#games"> <div class="sidenavOff"> <img src = "images/card_normal.png" /> <img src = "images/category_icons/icon_games.png" style = "position: a ...

javascriptjquerycsshtml

Step-by-step guide on incrementally counting localStorage items using jQuery

After spending an excessive amount of time on this project, I have hit a roadblock. Despite days of testing, I am unable to achieve my desired outcome. I am developing an image voting system that will track votes in localStorage. Since this is within Word ...

javascriptjqueryhtmlcsswordpress

Accessing Session Objects in Struts2 Using a Different Session Object as a Key

I am fairly new to working with Struts2 and currently, I am faced with the challenge of retrieving a session object using a dynamic session key. Here's how my application flow goes: The user will trigger the action from their browser http://localhos ...

javajavascriptjspstruts2

Exploring the handling of datetime in Bokeh when updating a datasource via Ajax

Currently, I am experimenting with a novel serverless reporting system centered around Bokeh and AJAX. However, I have encountered a challenge related to dates and times. I have successfully set up a version that streams numerical data from a cloud functio ...

javascriptpythonajaxbokeh

What steps can I take to implement a functional 'echo' command within a Jquery terminal?

Trying to create an echo command that displays what the user types in a JQuery terminal. Here is the code snippet: <link href="https://unpkg.com/jquery.terminal/css/jquery.terminal.min.css" rel="stylesheet" /> <script src="https://cdnjs.clou ...

javascripthtmljqueryterminaljquery-terminal

Encountering issues with the setValue function in Nightwatch

Currently, I am in the process of setting up a new Nightwatch project to automate a basic Google search page. The assertion for searchbox present on page is successful, but I am facing difficulties performing any mouse or keyboard actions on the elements ( ...

javascriptseleniumnightwatch.js

The variable you have attempted to access has not been assigned

Querying mongo through mongoose with customer.find() returns the following data: [{ _id: 5029a09e099fb5095fdb2d73, clientId: 22, company: 'X', email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="97cfd7 ...

javascriptnode.jsmongodb

Search through array elements that are nested deeply

Consider the following scenario: an array is provided as input containing various objects with nested elements. The goal is to filter this array in JavaScript and obtain a new array consisting only of objects where the key "navigation" has a value of true. ...

javascriptarraysfilter

Guide to calling or attaching a JavaScript function when an input in Wordpress is blurred

My challenge involves attempting to trigger a function using the onblur event of a textbox. Initially, I tried calling the function directly within the HTML but encountered issues. To resolve this, I moved all my JavaScript code into a separate file and ...

javascriptjquerywordpressjquery-events

What is the reason behind req.body only receiving the name attribute from a POST request in Node.js?

Hello there, this might be my first query on the subject, so please forgive me if it seems trivial. I am delving into the realm of web development with a focus on JavaScript and Node.js. My current project entails transmitting data from an EJS page to be s ...

javascripthtmlnode.jsexpressejs

A guide to using a loop to make a URL request, extract information, find a new URL within the data, and repeat the process for the specified number of pages

I would like to achieve the following: Access a specific URL (www.source.com/1 below) Retrieve all URLs from that page (e.g. www.urllookingfor.com/1 to .../10) and display them in the console Extract a new URL (e.g. www.source.com/2) from the same page ...

javascriptnode.jsexpresscheerio

Tips for concealing select options after choosing with select picker?

Our establishment features three distinct rooms, each offering three identical options that users can choose from. https://i.sstatic.net/Jx4Me.png To illustrate, if a user named John selects option one in the first room, that same option will be hidden w ...

javascripthtmljquerybootstrap-5bootstrap-selectpicker

how to use AngularJS filter and ng-options to format specific options as bold in a select dropdown

I am currently utilizing AngularJS ng-options to populate specific select elements. I am interested in bolding and disabling certain options. Despite trying to achieve this using the filter along with ng-options, I have been unsuccessful so far. While I ca ...

javascripthtmlangularjsangularjs-filterangularjs-controller

Retrieve information from a deep array structure

How can I extract the `id` from each marker's `routes` array in this JavaScript object while still referencing `item.id`? { "markers": [ { "id": "77475", "smsCode": "77475", "name": "Abbey Sports Centre" ...

javascriptjquery

When the value is removed, it does not revert back to the initial filtered choices

After clearing the input, I want to display all the original li's again. The issue is that even though .value = '' clears the input, the filter remains active. I could really use some help with this as it's starting to get on my nerves ...

javascripthtmlfilter

Expressions in AngularJS are enclosed by double square brackets [[]] instead of the conventional curly braces

I downloaded an app from CodePen that I'm using, but I'm having trouble using expressions in this format {{Expression}}. It seems like I need to use it in this way instead [[]]. Here is the code for the app: <!DOCTYPE html> <html> ...

htmlangularjsexpressionangular-ui