30 lines
1.1 KiB
Markdown
30 lines
1.1 KiB
Markdown
# .cadoles-slide-title[Routage dans le navigateur (2/3)]
|
|
|
|
**Le module `ngRoute`**
|
|
- Il permet de gérer l'association entre vue/contrôleur/route côté client.
|
|
- Initialement intégré directement dans Angular, il a migré dans son propre module.
|
|
|
|
**Définition des routes & usage**
|
|
```html
|
|
<div ng-app="myApp">
|
|
<ng-view></ng-view> <!-- La directive 'ng-view' est le point de montage des templates de nos routes -->
|
|
</div>
|
|
|
|
<script>
|
|
// On déclare la dépendance de notre module au module ngRoute
|
|
var myApp = angular.module('myApp', ['ngRoute']);
|
|
|
|
// La méthode config() d'un module permet d'exécuter du code à l'initialisation de celui ci
|
|
myApp.config(['$routeProvider', function($routeProvider) {
|
|
|
|
$routeProvider
|
|
.when('/my/route/:myParams', { // Les routes peuvent comporter des paramètres
|
|
templateUrl: 'path/to/route/template.html', // Chemin du template à charger
|
|
controller: 'MyRouteCtrl' // Optionnel, contrôleur associé à ng-view pour cette route
|
|
})
|
|
.otherwise('/my/default/route') // Route par défaut si aucun match
|
|
;
|
|
}]);
|
|
</script>
|
|
```
|