Currently, I have a scenario where I make two separate ajax calls in a service. The first call, known as AjaxOne, retrieves data from the fields (which are entered by the user). After obtaining this data, my objective is to manipulate it by passing it to another ajax call called AjaxTwo, which will provide me with the desired results. Both of these ajax calls are part of entirely different services and can be accessed by multiple controllers. Therefore, I have encapsulated them within their own distinct Angular factory methods (or possibly service).
The issue I am facing is that at present, I find myself considering a traditional sequential approach similar to PHP as demonstrated in the pseudo code snippet below (even though I am fully aware that this method would not function properly in this context). I understand that I should be thinking in parallel, but I am struggling to figure out what steps I need to take in order for the controller to effectively transmit the outcomes of AjaxOne to AjaxTwo. It is important to note that both factory methods do not necessarily need to be aware of each other's existence, in order to prevent coupling and ensure maximum reusability.
Can anyone guide me on how I can achieve this functionality using Angular?
app.controller('app', function( $http, $scope, AjaxOne, AjaxTwo ) {
$scope.fields = '';
$scope.ajaxOne = AjaxOne;
$scope.ajaxTwo = AjaxTwo;
$scope.results = [];
$scope.process = function () {
AjaxOne.getResults($scope.fields);
$scope.results = AjaxTwo.getResults(AjaxOne.results);
};
});
Appreciate any assistance on this matter.