How we can merge json object together - angularjs

Question

i have my first function:
$scope.loadDataFromToMonth= function (from,to,year) {
// $scope.loadDataFromToMonthArrivee(from,to,2016);
var url = servername+'admin/dashboard/getIncidentDepartByMonthFromTo/'+from+'/'+to+'/'+year;
// alert(url);
function onSuccess(response) {
console.log("+++++getIncidentDepartByMonthFromTo SUCCESS++++++");
if (response.data.success != false) {
$scope.payloadgetIncidentDepartByMonthFromTo = response.data.data;
var getIncidentDepartByMonthFromTo= $scope.payloadgetIncidentDepartByMonthFromTo;
console.log(JSON.stringify(getIncidentDepartByMonthFromTo));
$scope.data = {}; // new object
$scope.data.datasets = []; // new array in data object ..
$scope.data.labels =[];
var theWholeOb={};
var dataSetObj = {}; //temp object to push into dataset array..
var dataSetObjtwo = {};
/////////////anomalies depart
dataSetObj.data = [];
dataSetObj.label= 'My First dataset';
dataSetObj.fillColor='rgba(220,220,220,0.2)';
dataSetObj.strokeColor= 'rgba(220,220,220,1)';
dataSetObj.pointColor= 'rgba(220,220,220,1)';
dataSetObj.pointStrokeColor= '#fff';
dataSetObj.pointHighlightFill= '#fff';
dataSetObj.pointHighlightStroke='rgba(220,220,220,1)';
getIncidentDepartByMonthFromTo.forEach(function(data) {
var monthNumber = $filter('date')(data.la_date, "MM");
var mun = data.number;
$scope.data.labels.push(monthNumber);
dataSetObj.data.push(mun);
});
$scope.data.datasets.push(dataSetObj);
}
else {
alert("failure");
}
};
function onError(response) {
console.log("-------getIncidentDepartByMonthFromTo FAILED-------");
//$scope.stopSpin('spinner-0');
console.log(response.data);
console.log("Inside getIncidentDepartByMonthFromTo error condition...");
};
//----MAKE AJAX REQUEST CALL to GET DATA----
ajaxServicess.getData(url,username,password, 'GET', '').then(onSuccess,onError);
};
this function return this result:
$scope.data = {
labels: ['Jan', 'Feb' 'Jul'],
datasets: [
{
label: 'My First dataset',
fillColor: 'rgba(220,220,220,0.2)',
strokeColor: 'rgba(220,220,220,1)',
pointColor: 'rgba(220,220,220,1)',
pointStrokeColor: '#fff',
pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(220,220,220,1)',
data: [75, 59, 80, 81, 56, 55]
}
]
};
it works good.
and i have the second function its return the same result but with different data of cours:
$scope.loadDataFromToMonthArrivee= function (from,to,year) {
var url =servername+'admin/dashboard/getIncidentArriveeByMonthFromTo/'+from+'/'+to+'/'+year;
//alert(url);
function onSuccess(response) {
console.log("+++++getIncidentArriveeByDate SUCCESS++++++");
if (response.data.success != false) {
$scope.payloadDayMonthYearData = response.data.data;
var loadedDataByDayMonthYear= $scope.payloadDayMonthYearData;
alert('xxx'+JSON.stringify(loadedDataByDayMonthYear));
$scope.data = {}; // new object
$scope.data.datasets = []; // new array in data object ..
$scope.data.labels =[];
var theWholeOb={};
var dataSetObj = {}; //temp object to push into dataset array..
var dataSetObjtwo = {};
/////////////anomalies arrivee
dataSetObjtwo.data = [];
$scope.date=[];
dataSetObjtwo.label='My Second dataset';
dataSetObjtwo.fillColor= 'rgba(151,187,205,0.2)';
dataSetObjtwo.strokeColor= 'rgba(151,187,205,1)';
dataSetObjtwo.pointColor= 'rgba(151,187,205,1)';
dataSetObjtwo.pointStrokeColor= '#fff';
dataSetObjtwo.pointHighlightFill='#fff';
dataSetObjtwo.pointHighlightStroke= 'rgba(151,187,205,1)';
loadedDataByDayMonthYear.forEach(function(data) {
var monthNumber = $filter('date')(data.la_date, "MM");
$scope.date.push(monthNumber);
var mun = data.number;
$scope.data.labels.push($scope.monthNumber);
dataSetObjtwo.data.push(mun);
});
$scope.data.datasets.push(dataSetObjtwo);
} else {
alert("failure");
}
// $scope.stopSpin('spinner-0');
};
function onError(response) {
console.log("-------getIncidentArriveeByDate FAILED-------");
//$scope.stopSpin('spinner-0');
console.log(response.data);
console.log("Inside getIncidentArriveeByDate error condition...");
};
//----MAKE AJAX REQUEST CALL to GET DATA----
ajaxServicess.getData(url,username,password, 'GET', '').then(onSuccess, onError);
};
this function return this result:
$scope.data = {
labels: [ 'Jan', 'Feb' 'Jul','Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
datasets: [
{
label: 'My Second dataset',
fillColor: 'rgba(151,187,205,0.2)',
strokeColor: 'rgba(151,187,205,1)',
pointColor: 'rgba(151,187,205,1)',
pointStrokeColor: '#fff',
pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(151,187,205,1)',
data: [ 102, 123, 145, 60, 161]
}
]
};
it works good also, but my question is : how i can declare the second function inside the first function and combine the data returned and get the final result like this:
$scope.data = {
labels: [ 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
datasets: [
{
label: 'My Second dataset',
fillColor: 'rgba(151,187,205,0.2)',
strokeColor: 'rgba(151,187,205,1)',
pointColor: 'rgba(151,187,205,1)',
pointStrokeColor: '#fff',
pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(151,187,205,1)',
data: [ 102, 123, 145, 60, 161]
},{
label: 'My First dataset',
fillColor: 'rgba(220,220,220,0.2)',
strokeColor: 'rgba(220,220,220,1)',
pointColor: 'rgba(220,220,220,1)',
pointStrokeColor: '#fff',
pointHighlightFill: '#fff',
pointHighlightStroke: 'rgba(220,220,220,1)',
data: [75, 59, 80, 81, 56, 55]
}
]
};

Answer 1

As long as your objects do only contain arrays you might solve this as follows:
$scope.combineParts = function(part1, part2) {
var merged = angular.copy( part1 );
for ( key in part1 )
{
if ( part2.hasOwnProperty(key) )
merged[key].push.apply(merged[key], part2[key])
}
return merged;
}
Demo in this fiddle: https://jsfiddle.net/gat4co9x/
Hope this helps. ;)
EDIT: To integrate just call the second function in onSuccess of the first, and the combineParts in the onSuccess of the second.

Answer 2

Thisis a bit of easier change for you,first call the $scope.loadDataFromToMonth(params); function and inside that function on success call second function $scope.loadDataFromToMonthArrivee(params); after you prepare $scope.data.
Now don't initialise $scope.data again in $scope.loadDataFromToMonthArrivee(params); and just do this $scope.data.datasets.push(dataSetObjtwo);
I have below provided the similar code so just try using same don't get confused and try anything new but stick to it and after this works you can work on separating labels list from the both objects.
$scope.loadDataFromToMonth= function (from,to,year) {
// $scope.loadDataFromToMonthArrivee(from,to,2016);
var url = servername+'admin/dashboard/getIncidentDepartByMonthFromTo/'+from+'/'+to+'/'+year;
// alert(url);
function onSuccess(response) {
console.log("+++++getIncidentDepartByMonthFromTo SUCCESS++++++");
if (response.data.success != false) {
$scope.payloadgetIncidentDepartByMonthFromTo = response.data.data;
var getIncidentDepartByMonthFromTo= $scope.payloadgetIncidentDepartByMonthFromTo;
console.log(JSON.stringify(getIncidentDepartByMonthFromTo));
$scope.data = {}; // new object
$scope.data.datasets = []; // new array in data object ..
$scope.data.labels =[];
var theWholeOb={};
var dataSetObj = {}; //temp object to push into dataset array..
var dataSetObjtwo = {};
/////////////anomalies depart
dataSetObj.data = [];
dataSetObj.label= 'My First dataset';
dataSetObj.fillColor='rgba(220,220,220,0.2)';
dataSetObj.strokeColor= 'rgba(220,220,220,1)';
dataSetObj.pointColor= 'rgba(220,220,220,1)';
dataSetObj.pointStrokeColor= '#fff';
dataSetObj.pointHighlightFill= '#fff';
dataSetObj.pointHighlightStroke='rgba(220,220,220,1)';
getIncidentDepartByMonthFromTo.forEach(function(data) {
var monthNumber = $filter('date')(data.la_date, "MM");
var mun = data.number;
$scope.data.labels.push(monthNumber);
dataSetObj.data.push(mun);
});
$scope.data.datasets.push(dataSetObj);
$scope.loadDataFromToMonthArrivee(params);//call the second list http call after you prepare first object ...
}
else {
alert("failure");
}
};
function onError(response) {
console.log("-------getIncidentDepartByMonthFromTo FAILED-------");
//$scope.stopSpin('spinner-0');
console.log(response.data);
console.log("Inside getIncidentDepartByMonthFromTo error condition...");
};
$scope.loadDataFromToMonthArrivee= function (from,to,year) {
var url =servername+'admin/dashboard/getIncidentArriveeByMonthFromTo/'+from+'/'+to+'/'+year;
//alert(url);
function onSuccess(response) {
console.log("+++++getIncidentArriveeByDate SUCCESS++++++");
if (response.data.success != false) {
$scope.payloadDayMonthYearData = response.data.data;
var loadedDataByDayMonthYear= $scope.payloadDayMonthYearData;
alert('xxx'+JSON.stringify(loadedDataByDayMonthYear));
var theWholeOb={};
var dataSetObj = {}; //temp object to push into dataset array..
var dataSetObjtwo = {};
/////////////anomalies arrivee
dataSetObjtwo.data = [];
$scope.date=[];
dataSetObjtwo.label='My Second dataset';
dataSetObjtwo.fillColor= 'rgba(151,187,205,0.2)';
dataSetObjtwo.strokeColor= 'rgba(151,187,205,1)';
dataSetObjtwo.pointColor= 'rgba(151,187,205,1)';
dataSetObjtwo.pointStrokeColor= '#fff';
dataSetObjtwo.pointHighlightFill='#fff';
dataSetObjtwo.pointHighlightStroke= 'rgba(151,187,205,1)';
loadedDataByDayMonthYear.forEach(function(data) {
var monthNumber = $filter('date')(data.la_date, "MM");
$scope.date.push(monthNumber);
var mun = data.number;
$scope.data.labels.push($scope.monthNumber);
dataSetObjtwo.data.push(mun);
});
$scope.data.datasets.push(dataSetObjtwo);
} else {
alert("failure");
}
// $scope.stopSpin('spinner-0');
};
function onError(response) {
console.log("-------getIncidentArriveeByDate FAILED-------");
//$scope.stopSpin('spinner-0');
console.log(response.data);
console.log("Inside getIncidentArriveeByDate error condition...");
};