As of right now I am making a call to the bookings API for a user with the id of "1001" this returns a JSON object with tons of keys and values.. As you guys can see from my forEach and ng-repeat I am grabbing the arrival_date and printing that on my bookings.html view That works great! However here is where it gets tricky for me as I am not very well versed in PHP, mysql and back-end stuff.
Aside from the arrival_date I need to get the actual first and last name of the customer.. It's my understanding that I need to do a cross-reference from the bookings table to the customers table which holds the customer_id but the users table is the one holding the customers first and last names! Not sure how I can do that.. The customers_id is '130' when I do on ng-repeat {{booking.customer_id}} I only get the number of the customer '130' and I know is because their actual info is not in that bookings table but in the customers table.
Forgive me if I make no sense but that exactly do I need to do to make this cross reference? Is this a Back-End PHP job or can I do this within Angular?
I've seen lots of examples on here and all over google. However I am curious as to if I do this on my PHP file where we have some DB queries happening and if I do it there.. do I have to make a brand new call to an other API??
Any feedback, suggestions or resources would be greatly appreciate it. Thank you so much in advance and have a good weekend all!
bookingService.js
angular.module('starter')
.service("BookingsService", function($http, $q) {
var self = this;
self.bookings = [];
self.getBookings = function () {
var deferred = $q.defer();
$http.get("http://localhost/apiv2/bookings/1001")
.success(function success (data) {
console.log(data);
var bookingData = data.forEach(function(trip) {
self.bookings.push({
arrival_date: trip.arrival_date
});
})
self.bookings = data;
deferred.resolve(true);
})
.error(function error (smg) {
console.error(msg);
deferred.reject(false);
})
return deferred.promise;
};
BookingsController.js
angular.module('starter')
.controller("BookingsCtrl", function($scope, BookingsService) {
$scope.today = [];
$scope.test = 'scope test';
BookingsService.getBookings().then(function success (data) {
console.log("Success!");
console.log(data);
if(data){
$scope.today = BookingsService.bookings;
}
}, function error (data) {
console.log("Error!")
bookings.html - view
<ion-view view-title="Your Bookings">
<ion-content>
<h3>Your Bookings</h3>
<ion-list>
<ion-item ng-repeat="booking in today">
<ion-list>
<ion-item>
<h4>
Passenger: {{booking.customer_id}}
Address:{{booking.arrival_address}}
</h4>
</ion-item>
</ion-list>
</ion-item>
</ion-content>
</ion-view>
