Incorporate an array into a JSON object using AngularJS

Question

Incorporate an array into a JSON object using AngularJS

I'm attempting to append a JSON array to a JSON object. Here's my code:

$scope.packageElement = {
    "settings": [
        {
            "showNextPallet": true,
            "isParcelData": false,
            "isFreightData": true,
            "name": 0
        }
    ]
};

dataFromServer = {
    "pData": [
        {
            "PKUNIT": "LP",
            "PKDESC": "LARGE PKG",
            "PKDLEN": 30,
            "PKDWDT": 20,
            "PKDHTG": 20
        }
    ]
};

$scope.packageElement.concat(dataFromServer.pData);

However, this is resulting in an error:

TypeError: undefined is not a function

at this line of code:

$scope.packageElement.concat(dataFromServer.pData);

This is the output I want to achieve:

var expectedOutPut = {
    "settings": [
        {
            "showNextPallet": true,
            "isParcelData": false,
            "isFreightData": true,
            "name": 0
        }
    ], "pData": [
        {
            "PKUNIT": "LP",
            "PKDESC": "LARGE PKG",
            "PKDLEN": 30,
            "PKDWDT": 20,
            "PKDHTG": 20
        }
    ]
};

Could someone please assist me in identifying where I am going wrong in my implementation?

javascript json angularjs

Answer 1

Answer №1

Here's a simple solution:

$scope.packageElement.pData = dataFromServer.pData;

The $scope.packageElement object does not have a concat function.

Alternatively, you can use angular.extend():

var expectedOutPut = angular.extend({}, $scope.packageElement, {'pData': dataFromServer.pData});

By doing this, you will create copies of the objects instead of modifying them.
_{Please note that angular.extend does not support deep copy for recursive merges.}

Answer 2

Here's a simple solution:

$scope.packageElement.pData = dataFromServer.pData;

The $scope.packageElement object does not have a concat function.

Alternatively, you can use angular.extend():

var expectedOutPut = angular.extend({}, $scope.packageElement, {'pData': dataFromServer.pData});

By doing this, you will create copies of the objects instead of modifying them.
_{Please note that angular.extend does not support deep copy for recursive merges.}

Incorporate an array into a JSON object using AngularJS

Answer №1

Similar questions

Continual strange errors persist with Node Package Manager (NPM)

Fetching JSON data and showcasing it

The Magnificent jQuery Widget Factory's _trigger Instance

Having trouble getting jQuery autocomplete to recognize the JavaScript data file

Enhance security measures by transmitting credentials as JSON data instead of the traditional form method in RESTful services during

Why won't the function activate on the initial click within the jQuery tabs?

Accessing a specific child div within a parent div using JavaScript and CSS

What is the best way to switch the CSS class of a single element with a click in Angular 2

How can the outcome of the useQuery be integrated with the defaultValues in the useForm function?

A pair of demands within an express service

Guide on creating a JSONP request

A guide on assigning a state variable to a dynamically generated component within a React application

Carousel Alert: Ensure that every child within the list is assigned a distinct "key" property

Assigning numerical ratings to a web-based questionnaire in HTML

How to achieve the functionality of ocibindbyname in JavaScript

Making an asynchronous request from jQuery to a Slim Framework API endpoint

What is the reason behind the infinite queries issue when using `to_json` with DataMapper objects and collections?

Combining all code in Electron using Typescript

Angular is the best method for properly loading a webpage

Is it beneficial to utilize jQuery ahead of the script inclusions?