SPA - handling DTOs

I want to implement SPA based on any js framework in e.g. Angular JS. I already have many existing Web APIs with informations that i need to show on app.I have to add 1 more that will manage new informations.New one will reference to other Dtos. My question is, better approach is to call APIs and compile Dto on web app or call APIs in new API merge all data and create GET method with ready object.

1st approach from website perspective:

Call (i know userId - based on logged in user [in this example = 1])

/get/order/{userId}
{
UserId: 1
Products:{1,2}
}

based on that call:

/get/user/1
{
FirstName: test,
LastName: test
}

/get/product/1
{
Price: 10,
Name: Test
}

/get/product/2
{
Price: 100,
Name: Test2
}

merge all data in Angular Js Web

2nd approach from website perspective:

Merge everything on Order Web API

Call:

/get/ordermerged/{userId}
{
   FirstName: test,
   LastName: test
   Products:
   {
      {
         Price: 10,
         Name: Test
      },
      {
         Price: 100,
         Name: Test2
      }
   }
}

I attach screenshot to better overview.

Diagram