After creating multiple Drupal views to generate various JSON endpoints for different HTTP requests using Angular, I find myself in a situation where I have separate controllers for each request in my Angular script (as shown below). However, I am now looking to consolidate these requests into a single controller. I believe that utilizing $q, promises, or factories could be the solution, but I'm not entirely certain. Any assistance on this matter would be greatly appreciated. Thank you.
var module = angular.module('main',[]);
module.directive("masonry", function () {
var NGREPEAT_SOURCE_RE = '<!-- ngRepeat: ((.*) in ((.*?)( track by (.*))?)) -->';
return {
compile: function(element, attrs) {
// auto add animation to brick element
var animation = attrs.ngAnimate || "'masonry'";
var $brick = element.children();
$brick.attr("ng-animate", animation);
// generate item selector (exclude leaving items)
var type = $brick.prop('tagName');
var itemSelector = type+":not([class$='-leave-active'])";
return function (scope, element, attrs) {
var options = angular.extend({
itemSelector: itemSelector
}, scope.$eval(attrs.masonry));
// try to infer model from ngRepeat
if (!options.model) {
var ngRepeatMatch = element.html().match(NGREPEAT_SOURCE_RE);
if (ngRepeatMatch) {
options.model = ngRepeatMatch[4];
}
}
// initial animation
element.addClass('masonry');
// Wait inside directives to render
setTimeout(function () {
element.masonry(options);
element.on("$destroy", function () {
element.masonry('destroy')
});
if (options.model) {
scope.$apply(function() {
scope.$watchCollection(options.model, function (_new, _old) {
if(_new == _old) return;
// Wait inside directives to render
setTimeout(function () {
element.masonry("reload");
});
});
});
}
});
};
}
};
});
angular.module('main',[]).controller('blogcontroller', function ($scope,$http) {
$http.get('/blog-filter').success(function(result){
$scope.blog = ( function () {
return result.nodes;
})();
});
});
angular.module('cs',[]).controller('cscontroller', function ($scope,$http) {
$http.get('/case-study-view').success(function(results){
$scope.cs = ( function () {
return results.nodes;
})();
});
});