<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Example - example-$route-service-production</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-route.js"></script>
<script src="script.js"></script>
<script type="text/javascript">
angular.element(document.getElementsByTagName('head')).append(angular.element('<base href="' + window.location.pathname + '" />'));
</script>
</head>
<body ng-app="app">
<div ng-controller="MainController">
<a href="tab/1">page 1</a>
<a href="tab/2">page 2</a>
<a href="tab/3">page 3</a>
<a href="tab">page Empty</a>
<hr />
<div ng-view></div>
</div>
</body>
</html>
<div ng-controller="EditProfileController">
{{selectedTab}}
</div>
<a href="./">back</a>
(function(angular) {
'use strict';
angular.module('app', ['ngRoute'])
.controller('MainController', function() {})
.controller('EditProfileController', function() {})
.controller('ProfileCtrl', function($scope, $route, $routeParams) {
$scope.$route = $route;
$scope.selectedTab = 'default';
if ($routeParams.page) {
$scope.selectedTab = $routeParams.page;
}
})
.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/tab/:page?', {
templateUrl: 'ProfileController.html',
controller: 'ProfileCtrl'
})
.otherwise('/');
$locationProvider.html5Mode(true);
});
})(window.angular);