I am working on a project using Angular UI Router and Coach Potato. I want the UI Router states to load from the server side and then be added to the state provider in the Angular app.config. However, I am encountering an issue where I cannot inject the $http service into the app.config function. My code looks like this:
var app = angular.module('app', ['ui.router.compat']);
app.config(['$stateProvider', '$routeProvider', '$urlRouterProvider', '$http',
function ($stateProvider, $routeProvider, $urlRouterProvider, $http) {
$urlRouterProvider
.when('/c?id', '/contacts/:id')
.otherwise('/');
$routeProvider
.when('/user/:id', {
redirectTo: '/contacts/:id'
});
var get = $http.get('/api/Values/');
get.success(function (data) {
list = data.result;
});
var populateStates = function () {
angular.forEach(list, function(item) {
$stateProvider.state(item);
angular.forEach(item.subMenus, function(sub) {
$stateProvider.state(sub);
});
});
};
populateStates();
}]);
How can I fetch data (states) from the server in app.config?