Steps for changing an array of objects from a string into a regular array of objects

I am facing an issue where I have an array of objects in string format that I need to convert into a normal array of objects. I tried using the JSON.parse() method for conversion, but when attempting to access values like: this.contact_data[0].data.value, it returns undefined.

Below is my array of objects:

contact_data.data='[{'name':"Number",'value':"22222222"},{'name':"gmail",'value':"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="0f7776754f686e626663216c6062">[email protected]</a>"}]'
javascriptvue.js

Answer №1

When you stringify an array of objects, the keys should be enclosed in double quotes like ", not single quotes '. If they are in single quotes, it will not parse correctly.

'[{"name":"Number","value":"22222222"},{"name":"gmail","value":"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="651d1c1f250204080c094b06aa1e191a">[email protected]</a>"}]'
is the proper way to stringify the array for correct parsing.

'[{'name':"Number",'value':"22222222"},{'name':"gmail",'value':"<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3e4647447e595f535752105d5153">[email protected]</a>"}]'
is the incorrect way your array is formatted.

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

Can anyone recommend a good library for generating keywords for content?

Recently, I've been working on developing a CMS to use on my website. I'm curious if there are any free libraries out there that can help generate tags based on content. For example: I have a love for trees. Trees are amazing plants that show ...

phpjavascriptcontent-management-systemtags

The problem with setting headers in Node Express MySQL: Error message indicating headers cannot be set after they have been sent

I'm currently working on a project using Node.js, Express.js, and a MySQL database. I have posts stored in the database that I want to display using the Pug.js view engine. I've managed to connect to the database and render the home route success ...

javascriptmysqlnode.jsexpresspug

Retrieve the JavaScript object that was initialized within a function

As I venture into the world of working with javascript objects and php objects, I've encountered an issue. While everything seems to be functioning correctly so far, I'm having trouble accessing the javascript object created in the ajax success r ...

javascriptajaxvariablesobject

Mapbox struggling with performance because of an abundance of markers

I have successfully implemented a feature where interactive markers are added to the map and respond to clicks. However, I have noticed that the performance of the map is sluggish when dragging, resulting in a low frame rate. My setup involves using NextJ ...

javascriptreactjsnext.jsmapsmapbox

The text is not appearing properly in an HTML file due to issues with

Hi trying to display the text received from the controller's scope. Here's what I have attempted: HTML: <div ng-repeat="item in sResults"></div> Controller JavaScript: $scope.sResults = []; function App( ){ var Label ...

javascriptangularjs

Tips for modifying the color or personalizing the header arrow for the expandableRow within Mui Datatable

My MUI data table has the expandable rows option, along with an ExpandAll button in the header row. The arrow displayed in the title row is confusing for users as it's similar to the arrows in all other rows. I want to change the color of the header a ...

javascriptreactjsmaterial-ui

make the chosen text appear on Internet Explorer

1 How to insert text into a text box using code? 2 Moving the caret to the end of the text. 3 Ensuring the caret is visible by scrolling the text box content. 4 Programmatically selecting specific text in a textbox. 5 **How to make selected text visible?** ...

javascriptjqueryhtmlinternet-explorer-11

Sign up for our Joomla website by completing the registration form and agreeing to our terms and conditions

I am currently working with Joomla 1.5 and I need to incorporate a checkbox for users to agree to the terms and conditions. I attempted to use the code below, but it is not functioning as expected. Even when the checkbox is ticked, it still triggers an a ...

javascripthtmljoomla

Is there a way to control the animation duration in Vue.js?

My goal is to create a custom indeterminate loader that does not rely on an existing solution. The loader will follow this template: <template> <div class="slider"> <div class="line" :style="getLineStyle"></div> <div c ...

vue.js

My mocks for Jest's readFile and writeFile functions are not being loaded

Just wondering, when using jest.mock(), can I only mock the entire module or can I also mock exported functions and constants? In my app.js file, I am using const fileSystem = require('fs'). I am trying to test an method in the app that reads a f ...

javascriptnode.jsexpressmockingjestjs

Sending an array of arrays from JavaScript to a Spring MVC controller via AJAX

Having a bit of trouble with passing arrays within arrays. The first example below shows a simple array being passed successfully. However, when attempting to pass an array of arrays in the second example, it doesn't seem to work. Any suggestions on h ...

javascriptjqueryarraysajaxspring-mvc

Why is it that despite passing all the unit tests successfully, the function fails when used in its actual context with the same parameters?

I have created a basic API to encrypt text using the Caesar cipher in Javascript with Express.js. While running tests with Jest, it seems that all the tests are passing successfully (and a console.log of the output confirms that the resulting string matche ...

javascriptnode.jsexpressjestjs

Launching Node Application

While working with NestJS and IIS, I encountered an issue when deploying my 'dist' folder on the server using IISNode. The error message 'module not found @nestjs/core' prompted me to install the entire 'package.json' files (n ...

javascriptnode.jstypescriptexpressnestjs

Is it possible for my code in ReactJS to utilize refs due to the presence of backing instances?

When working with ReactJS components, I often piece together JSX elements to create my code. For example, take a look at the snippet below. I recently came across this page https://facebook.github.io/react/docs/more-about-refs.html which mentions that "Re ...

javascriptreactjsecmascript-6

Why isn't data coming through after sending ajax post requests?

Why am I unable to retrieve data after sending AJAX post requests? During the process of sending an AJAX post request, I use $('#fid1 input,select').attr('disabled','disbaled'); to disable form inputs and then, after a suc ...

javascriptphpjqueryajax

Tips for displaying "onclick" content beside dynamically generated content

I am working on a feature where a dynamically generated list has radio buttons displayed next to it. The goal is to show a dropdown list next to the specific radio button and list item that was changed. Essentially, if the radio button is set to "yes," I w ...

javascriptphpjqueryajaxjquery-events

Mongoose: An unexpected error has occurred

Recently, I developed an express app with a nested app called users using Typescript. The structure of my app.js file is as follows: ///<reference path='d.ts/DefinitelyTyped/node/node.d.ts' /> ///<reference path='d.ts/DefinitelyTyp ...

javascriptmongodbexpressmongoosetypescript

Unique markers for Google Maps

I have been working on creating custom Google maps with the concept of incorporating 3 distinct markers such as forests, rivers, and lakes. While I have successfully added these custom markers using a helpful tutorial, I am now facing a challenge with sor ...

javascriptgoogle-maps-markers

Tips for preventing line breaks within table cells

Looking at the image below, I need to display the Hallticket in a single line. The first one is retrieved directly from the database, while the second one is added dynamically using JavaScript. How can I show both sets of data in a single line? https://i. ...

javascriptphpjqueryhtmlcss

Issue with function incorrectly computing values and returning NaN

My challenge is to develop a countdown timer, but it keeps returning NaN instead of counting down. I have multiple counters in place - one that counts down, another that counts up until the stop time specified by stoptime, and a third that kicks in after s ...

javascriptjqueryhtml