Creating a JavaScript object that grabs each array item and collates it

Issue

I am trying to create a JavaScript object that grabs each services array in BusinessData, and then collates it as follows:

services: [
                {
                    id: 1,
                    businessId: 1,
                    title: 'Brake Fluid Refresh'
                },
                {
                    id: 2,
                    businessId: 1,
                    title: 'Diagnostics'
                },
                {
                    id: 3,
                    businessId: 1,
                    title: 'Coolant Refresh'
                },
                {
                    id: 4,
                    businessId: 1
                    title: 'Oil Change'
                },
                {
                    id: 5,
                    businessId: 1,
                    title: 'MOT'
                },
                {
                    id: 6,
                    businessId: 1,
                    title: 'Summer Check'               
                },
                {
                    id: 7,
                    businessId: 1,
                    title: 'Winter Check'                   
                }           
            ]

This is my code so far:

var businessData = [
        {
            id: 1,
            categoryId: 1,
            name: 'Japan Center Garage',
            services: [
                {
                    id: 1,
                    businessId: 1,
                    title: 'Brake Fluid Refresh'
                },
                {
                    id: 2,
                    businessId: 1,
                    title: 'Diagnostics'
                }               
            ]
        },
        {
            id: 2,
            categoryId: 1,
            name: 'Rex Garage',
            services: [
                {
                    id: 3,
                    businessId: 1,
                    title: 'Coolant Refresh'
                },
                {
                    id: 4,
                    businessId: 1
                    title: 'Oil Change'
                }   
            ]
        },
        {
            id: 3,
            categoryId: 1,
            name: 'Mission & Bartlett Garage',
            services: [
                {
                    id: 5,
                    businessId: 1,
                    title: 'MOT'
                },
                {
                    id: 6,
                    businessId: 1,
                    title: 'Summer Check'               
                },
                {
                    id: 7,
                    businessId: 1,
                    title: 'Winter Check'                   
                }               
            ]
        }               
    ]

    return {
        getAllCategories: function () {
            return categoryData;
        },

        getAllServices: function () {
            var servicesData = {
                services: []
            };
            for(var i = 0; i < businessData.length; i++) {
                if(businessData[i].services) {
                    servicesData['services'].push(businessData[i].services)
                }
            }
            return servicesData;
        },

        getAllBusinesses: function () {
            return businessData;
        },
    }
}])

It doesn't work very well, and produced an array that I can't seem to access in my view after calling it from my controller:

<div class="item item-divider">
Service
</div>
<ion-list>
<ion-item ng-repeat="item in serviceList | orderBy:'title'">
  <p>{{item.title}}</p>
</ion-item>
</ion-list>
<div ng-if="item !== undefined && !item.length" class="no-results">
<div class="item" style="border-top: 0px">
    <p>No Results</p>
</div>
</div>

Update

serviceList is called from my the controller:

$scope.serviceList = ServicesData.getAllServices();

What is going wrong here?

Solution

var services = [];

businessData.forEach(function (business) {
    Array.prototype.push.apply(services, business.services);
});

You are almost there, but you are pushing array of services to an array. By using Array.prototype.push.apply, we are instead pushing services to an array. Which eventually gives you the result you want :)

Answered By - Prashant