Add an array to json object angularjs

Question

I am trying to add a JSON array to a JSON object. My code is like this

$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);

But this throws an error

TypeError: undefined is not a function

at line

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

My desired output is like this

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

Can any one point out what I am doing wrong here?

Answer 1

Simple:

$scope.packageElement.pData = dataFromServer.pData;

$scope.packageElement is an object, it doesn't have a concat function.

Or, a better option could be to use angular.extend() :

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

This way, you'll copy the objects, instead of modifying them.
_{Note: Keep in mind that angular.extend does not support recursive merge (deep copy).}