Menu
I'm checking out angular routing.
http://www.bennadel.com/blog/2420-Mapping-AngularJS-Routes-Onto-URL-Parameters-And-Client-Side-Events.htm
The examples I see have all the routes be defined in the same file. How do I have various routes be defined in different files / modules?
335
Routing in AngularJS is used when the user wants to navigate to different pages in an application but still wants it to be a single page application. AngularJS routes enable the user to create different URLs for different content in an application.
Multiple Outlets And Auxiliary Routes # Angular Router supports multiple outlets in the same application. A component has one associated primary route and can have auxiliary routes. Auxiliary routes enable developers to navigate multiple routes at the same time.
$stateProvider is used to define different states of one route. You can give the state a name, different controller, different view without having to use a direct href to a route. There are different methods that use the concept of $stateprovider in AngularJS.
AngularJS ngRoute module provides routing, deep linking services and directives for angular applications. We have to download angular-route. js script that contains the ngRoute module from AngularJS official website to use the routing feature. You can also use the CDN in your application to include this file.
In AngularJS routes are defined in configuration block. Each AngularJS module can have multiple configuration blocks and you can define routes in each and every configuration block. The final routing for the entire application is a sum of routes defined in all modules.
In practice you can do it like:
angular.module('myModule1', []).config(function($routeProvider){ //define module-specific routes here }); angular.module('myModule2', []).config(function($routeProvider){ //define module-specific routes here }); angular.module('myApp', ['myModule1', 'myModule2']).config(function($routeProvider){ //define app-level routes here }); Regarding the split over files - I guess this largely depends on how you split AngularJS modules in files. What I would recommend is sticking to one-file equals one-module principle.
You can see all this applied to a larger-scale web application in angular-app, an effort to build a reference for a non-trivial application written in AngularJS:
In the mentioned app you can see routes defined in multiple files, ex.:
160
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
