angular.module('ngView', ['ngRoute']).config(function($routeProvider, $locationProvider) {
  $routeProvider.when('/Book/:bookTitle*/:pageNum', {
    templateUrl: 'book.html',
    controller: BookCntl
  });
  
  $locationProvider.html5Mode(true);
});

function MainCntl($scope, $route, $routeParams, $location) {
  $scope.$route = $route;
  $scope.$location = $location;
  $scope.$routeParams = $routeParams;
}

function BookCntl($scope, $routeParams) {
  $scope.name = "BookCntl";
  $scope.params = $routeParams;
}
controller: {{name}}<br />
Book Title: {{params.bookTitle}}<br />
Page Number: {{params.pageNum}}<br />
<!doctype html>
<html ng-app="ngView">
  <head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript">
//this is here to make plunkr work with AngularJS routing
angular.element(document.getElementsByTagName('head')).append(angular.element('<base href="' + window.location.pathname + '" />'));
</script>
</head>
  <body>

<div ng-controller="MainCntl">
  Choose:
  <a href="Book/Long/Title/Here/56">Book1</a> |
  <div ng-view></div>
  <hr />

  <pre>$location.path() = {{$location.path()}}</pre>
  <pre>$route.current.templateUrl = {{$route.current.templateUrl}}</pre>
  <pre>$route.current.params = {{$route.current.params}}</pre>
  <pre>$route.current.scope.name = {{$route.current.scope.name}}</pre>
  <pre>$routeParams = {{$routeParams}}</pre>
</div>


  </body>
</html>