Angular: Empty Fiddle
http://angularjs.org/
by ncapito
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
<div ng-app="MyApp">
<a href="/1">Test 1</a>
<script type="text/ng-template" id="test/1.html">
Test page 1
</script>
<script type="text/ng-template" id="test/2.html">
Test page 2
</script>
<div ng-controller="MyCtrl">Hello, {{name}}!
<hr />
<div ng-view></div>
<hr />
</div>
</div>
JavaScript
var myApp = angular.module('myApp', [],function ($routeProvider, $locationProvider) {
$routeProvider.when('/', {
url: 'test/1.html',
controller: OneCtrl
}).when('/:id', {
url: 'test/2.html',
controller: TwoCtrl
}).otherwise({
redirectTo: '/111'
});
$locationProvider.html5Mode(true);
});
function MyCtrl($scope, $location) {
$scope.name = 'test';
}
function OneCtrl($scope, $routeParams) {
$scope.name = '1';
}
function TwoCtrl($scope, $routeParams) {
$scope.name = '2';
}