基于JSON配置在运行时动态构建AngularJS路由

Question

我有一个JSON配置，我想基于它构建我的角度路由。本质上，我想要角度应用程序来获取json，构建路由，然后引导应用程序。我提出了一个有效的解决方案，但它似乎没有遵循标准的角度范例，我想弄清楚用什么模式来适应它。也许作为服务/工厂或单独的模块？

JSON：

{
    "routes" : [
        {
            "route_name"              : "home",
            "route"                   : "/",
            "visible_in_menu"         : true,
            "menu_title"              : "Home",
            "menu_font_awesome_icon"  : "fa-home",
            "controller"              : "HomepageController",
            "template"                : "app/templates/home.html",
            "child_routes"            : null
        },
        {
            "route_name"              : "discover",
            "route"                   : "/discover",
            "visible_in_menu"         : true,
            "menu_title"              : "Discover",
            "menu_font_awesome_icon"  : "fa-search",
            "controller"              : "DashboardAppController",
            "template"                : "app/templates/dashboard.html",
            "child_routes"            : null
        }
    ],

}

功能齐全的代码：

var app = angular.module('dashboardApp',['ngRoute', 'ngAnimate', 'ui.bootstrap']);


// Grab dashboard config, load angular app
fetchData().then(bootstrapApplication);


/**
 * Grabs the dashboard configuration prior to the angular application
 * being loaded.
 */
function fetchData() {
    var initInjector = angular.injector(["ng"]);
    var $http = initInjector.get("$http");

    return $http.get("app/routes_menu_config.json").then(function(response) {
        app.constant("routes_menu_config", response.data);
    }, function(errorResponse) {
        // Handle error case
    });
}


/**
 * Enables the angular application
 */
function bootstrapApplication() {
    buildRoutes();
    angular.bootstrap(document, ["dashboardApp"]);
}


/**
 * Method for building the application's routes at run time based on the routes_menu_config.json 
 */
function buildRoutes(){

    // Grab the JSON extracted from the config file
    var routesAndMenuConfig = angular.injector(['dashboardApp']).get('routes_menu_config');

    var routes = routesAndMenuConfig["routes"]; 

    // Configure angular routes based on JSON
    app.config(['$routeProvider', '$locationProvider',
        function($routeProvider, $locationProvider) {

            for(var i=0; i < routes.length; i++){

                var currentRoute = routes[i];

                // If the current node actually has a route, add it
                if(currentRoute.route){
                    $routeProvider.
                        when(currentRoute.route, {
                            templateUrl: currentRoute.template,
                            controller: currentRoute.controller
                    });
               }

               // If the current node actually has child routes, add them
               if(currentRoute.child_routes){
                    for(var j=0; j < currentRoute.child_routes.length; j++){
                        var currentChildRoute = currentRoute.child_routes[j];

                        $routeProvider.
                            when(currentChildRoute.route, {
                                templateUrl: currentChildRoute.template,
                                controller: currentChildRoute.controller
                      });
                    }
               }

            }

    }]);

}