2

I'm trying to load routes from server. when user navigate to a route via link it works perfectly, but when user hit F5 or open a route from bookmarks page will be empty. I tried $state.reload() after for loop but it causes "Cannot transition to abstract state '[object Object]'" error

var app = angular .module("app ", ["ui.router"]) .config(function ($stateProvider, $urlRouterProvider) { app.stateProvider = $stateProvider; app.urlRouterProvider = $urlRouterProvider; }) .run(function ($http, $state, $stateParams) { $http({ method: 'POST', url: '/Config/GetRoutes' }).success(function (data, status) { for (i in data.routes) { app.stateProvider.state(data.routes[i].name, { url: "/" + data.routes[i].name, templateUrl: data.routes[i].url, controller: 'sectionController' }); } }); }) ;
Improve this question
2
  • Try calling $state.reload() after your for loop Commented May 8, 2015 at 12:20
  • It causes Cannot transition to abstract state '[object Object] error! Commented May 8, 2015 at 12:23

2 Answers 2

Reset to default
2

Finally I found my answer!

var app = angular .module("app ", ["ui.router"]) .config(function ($stateProvider, $urlRouterProvider) { app.stateProvider = $stateProvider; app.urlRouterProvider = $urlRouterProvider; //defer intecepting $urlRouterProvider.deferIntercept(); }) .run(function ($http, $state, $stateParams) { $http({ method: 'POST', url: '/Config/GetRoutes' }).success(function (data, status) { for (i in data.routes) { app.stateProvider.state(data.routes[i].name, { url: "/" + data.routes[i].name, templateUrl: data.routes[i].url, controller: 'sectionController' }); } // intecepting again $urlRouter.sync(); $urlRouter.listen(); }); }) ;
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

0

Hi I believe better solution is to write a provider to add routes dynamically, then use that in run function.

http://plnkr.co/edit/C2gXMo?p=preview

app.provider("DinamicRouteProvider", DinamicRouteProvider); function DinamicRouteProvider($stateProvider) { return { $get: function( $state ) { return { addRoute: function (route){ $stateProvider .state(route.name, { url: '/' + route.name, template: '<div><h2>This is '+route.name+'</h2></div>', controller: 'DynCtrl' }); console.log('State added', route) } }; } }; }
Improve this answer

Comments