Kalpana K Kalpana K - 3 months ago 22
AngularJS Question

How can i store and use the json data inside route provider

$routeProvider

.when('/accordion', {(need to get the name from json)

templateUrl: 'Samples/accordion.html',(need to get the urlfrom json)
controller: "AccordionCtrl",

})


How to store the name and template url in
json
and how to get the name and template url from
json

Answer

Please check below code which will take input as templates.json file and it will help create dynamic routes

'use strict';
var app = angular.module('app', ['ngRoute']);

var $routeProviderReference;
var currentRoute;
app.config(function($routeProvider){
    $routeProviderReference = $routeProvider;
});
app.service('shareData', function(){
    app.run(['$route', '$http', '$rootScope', function($route, $http, $rootScope){
    $http.get("templates.json").success(function(data){
        var loop = 0, currentRoute;
        for(loop = 0; loop < data.pages.length; loop++){
            currentRoute = data.pages[loop];
            var routeName = "/" + currentRoute.name;
            $routeProviderReference.when(routeName, {
                templateUrl: currentRoute.tempUrls,
                controller : currentRoute.controller,
                resolve: {
                    param: function()
                    {
                        return currentRoute.resolve;
                    }
                }
            });
        }
            $route.reload();
    });
    }]);
    app.controller(currentRoute.controller, function($scope){
        $scope.pageClass = 'page-' + currentRoute.name;
    });
});

Also find the json file demo as below:

{
  "pages" : [
    {
    "name"        : "home",
    "tempUrls"    : "views/home",
    "controller"  : "HomeController"
    },
    {
      "name"        : "about",
      "tempUrls"    : "views/about",
      "controller"  : "AboutController"
    },
    {
      "name"        : "contact",
      "tempUrls"    : "views/contact",
      "controller"  : "ContactController"
    }
  ]
}

Hope this would help you out.!

Comments