{"id":6848,"date":"2014-05-03T05:11:57","date_gmt":"2014-05-03T05:11:57","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2014\/05\/03\/dynamic-routing-in-angularjs-can-i-retrieve-data-from-server-before-setting-up-routeprovider-collection-of-common-programming-errors\/"},"modified":"2014-05-03T05:11:57","modified_gmt":"2014-05-03T05:11:57","slug":"dynamic-routing-in-angularjs-can-i-retrieve-data-from-server-before-setting-up-routeprovider-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2014\/05\/03\/dynamic-routing-in-angularjs-can-i-retrieve-data-from-server-before-setting-up-routeprovider-collection-of-common-programming-errors\/","title":{"rendered":"Dynamic Routing in AngularJS &#8211; Can I retrieve data from server before setting up $routeProvider?-Collection of common programming errors"},"content":{"rendered":"<p><strong>Update:<\/strong> @dnc253 &#8212; angular-detour is now ready enough that I think you could use it to get routes loaded from json. It&#8217;s not yet well-documented and doesn&#8217;t have tests, so it&#8217;s certainly not complete in that sense, but the merging of json into a live instance of the router has been working for a while.<\/p>\n<p>If you&#8217;re still looking for a way to use server defined routes, you can read instructions on running the samples and then check out the third sample&#8217;s mergeJson call in app.js. Feedback would be great &#8212; I&#8217;m getting started on real documentation\/tests now, so there&#8217;s no need to tell me that the documentation sucks and there aren&#8217;t any tests &#8212; I&#8217;m on that one. \ud83d\ude42 Hopefully the samples are enough to squeak by if this functionality is still on your list of needs<\/p>\n<p><strong>Older part of the answer:<\/strong> If you just want a static set of routes that are defined by the server with JSON, you could use something like JQuery to fetch your routing data <em>before<\/em> you configure your app.<\/p>\n<p>Pseudocode:<\/p>\n<pre><code>$.ajax({\n  url: \"http:\/\/example.com\/routes\"\n  }\n}).done(function ( data ) {\n    angular\n        .module('myApp',[])\n        .config(function($routeProvider) {\n          \/\/read routing instructions from data and call \"when\" on $routeProvider to define the routes\n         });\n\n});\n<\/code><\/pre>\n<p>This should work with ui-router as well. But it only enables you to fetch an initial set of routes, so while it gives you the possibility of data-driven definitions, they are only driven by the data that was available when the app was loaded by the client.<\/p>\n<p>As eazel7 points out, you <strong>can<\/strong> access providers at run time if you create your own service that binds to the provider at config time. <strong>However<\/strong>, to do what you want to do you need to go out of process to do an $http call, and with the current routers (the stock Angular core and ui-router) you won&#8217;t get your answer in time to populate the router before a deep link fails when someone visits your site. Additionally both of those routers use functions to populate the routing &#8220;table&#8221; and thus do not lend themselves to having the routing updated after it has been initially configured.<\/p>\n<p>I&#8217;m working on something that addresses these issues, such that if a requested route is unknown to the router, it will attempt to fetch it from the server <em>before<\/em> invoking the fallback route or failing. Also will support checking for modifications to known routes. Essentially lazy routing with an AJAX\/JSON interface to the server. It&#8217;s based on ui-router, and is living at https:\/\/github.com\/afterglowtech\/angular-detour . It currently implements the editability of routes but I haven&#8217;t done the laziness\/server communication pieces. That&#8217;s next on my list. Keep an eye on it, it should end up doing what you&#8217;re looking for.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Update: @dnc253 &#8212; angular-detour is now ready enough that I think you could use it to get routes loaded from json. It&#8217;s not yet well-documented and doesn&#8217;t have tests, so it&#8217;s certainly not complete in that sense, but the merging of json into a live instance of the router has been working for a while. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-6848","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/6848","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=6848"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/6848\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=6848"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=6848"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=6848"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}