Tutorial #25 del curso de angular JS, en este tutorial veremos como utilizar el sistema de rutas de angular, para ello integraremos el módulo angular-route.js, además de utilizar la directiva ng-include que nos permite inyectar trosos de código en determinados sectores de nuestra aplicación.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Routing</title>
<script type="text/javascript" src="angular.min.js"></script>
<script type="text/javascript" src="angular-route.min.js"></script>
</head>
<body ng-app="routingApp">
<div ng-include="'plantillas/menu.html'"></div>
<div ng-view></div>
<script type="text/javascript">
var miRouting = angular.module('routingApp', ['ngRoute']);
miRouting.config(['$routeProvider',function($routeProvider) {
$routeProvider.when('/seccion1',{
templateUrl:'plantillas/seccion1.html'
}).when('/seccion2',{
templateUrl:'plantillas/seccion2.html'
}).otherwise({
redirectTo:'/'
});
}]);
</script>
</body>
</html><ul> <li><a href="#/">Inicio</a></li> <li><a href="#/seccion1">Seccion 1</a></li> <li><a href="#/seccion2">Seccion 2</a></li> </ul>
<h1>SECCIÓN 1</h1> <p>Estás viendo la primera sección</p>