Angular+JQ+Bootstrap

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.angularjs.org/1.0.0/angular-1.0.0.js"></script>
<div ng-controller="MainCtrl">
    <div ng-view></div>
</div>

<script type="text/ng-template" id="home.html">
    <h5>Hi, I'm home</h5>
    <a href="#/bob">Go to bob</a>
</script>
<script type="text/ng-template" id="bob.html">
    <h5>Hi, I'm bob</h5>
    data.frank: <input ng-model="data.frank"><br/>
    data.joe: <input ng-model="data.joe"><br/>
    data: {{data | json}}<br />
    url: {{windowLocation()}}
</script>

JavaScript

var app=angular.module('myApp', []);

app.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'home.html',
        })
        .when('/bob', {
            templateUrl: 'bob.html',
            controller: 'BobCtrl'
        })
        .otherwise({
            redirectTo: '/'
        });
});

function params(data) {
    var params=[];
    angular.forEach(data, function(value, key) {
        params.push(key+'='+value);
    });
    return params.join('&');
}   

function MainCtrl($scope) {
    
}

function BobCtrl($scope, $location, $routeParams) {
    $scope.data = {
        frank: parseInt($routeParams.frank) || 6,
        joe: parseInt($routeParams.joe) || 5
    };
    $scope.windowLocation = function() {
        return window.location.url;
    };
    
    $scope.$watch('data', function(value) {
        window.location.url =$location.path();
    }, true);
}