NOTE: This is a dynamic app.
I'm using angular routes, so i made a resolve to call the data before loading the controller, i have multi pages with one route [Dynamic Routing], i'm able to return different data for each page, depending on it's slug, however some data will be returned no matter what is the slug is, so for that i returned some keys for the data which returns true or false.
what i'm asking for is am i able to check if a key is true, and request it's data before loading the controller? Fully Front Ended
// Routes
app.config(function($routeProvider, $locationProvider){
$routeProvider
.when('/:name', {
templateUrl: '/views/main.html',
controller: 'mainCtrl',
resolve: {
// RESOLVE THE MAIN DATA
page: function(srvLibrary,$route, $rootScope) {
return srvLibrary.getPage($route.current.pathParams.name);
},
// RESOLVE THE PROJECTS DATA
projects: function(srvLibrary,$route, $rootScope) {
return srvLibrary.getProjects();
}
}
});
});
// USING FACTORY TO RESOLVE DATA
app.factory('srvLibrary', ['$http','$rootScope', '$interval' ,'$route', function($http,$rootScope, $interval, $route) {
return {
getPage: function(slug) {
// THIS IS THE MAIN PAGE PROMISE [DYNAMIC ROUTED]
var promise = $http({
method: 'GET',
url: baseUrl + '/api/v1/page.json',
params: {menu_slug: slug}
})
promise.then(
function(data) {
return data;
},
function(error) {
return false;
},
function(progress) {
// report progress
});
return promise;
},
// PROJECTS DATA
getProjects: function() {
var promise = $http({
method: 'GET',
url: baseUrl + '/api/v1/portfolio.json'
});
promise.success(function(data) {
return data;
});
return promise;
},
}
});
// MAIN CONTROLLER
app.controller('mainCtrl', function($scope, page){
$scope.data = page.data;
$scope.projects = projects.data;
});I was able to return the data depending on the key using the controller it's self, however there's some delays, the data ofcourse loads after the controller is fully load, some functions [plugins] not working probably, and other issues.
Thanks For Reading
