Navigation similar to UINavigationController in AngularJS webapp

I want my webapp to behave just like other iPhone apps using a UINavigationController.

I wish to start with two views: the root view and a navigation bar.

When a new view should be shown, it will be put on top of the current one, merely hiding the previous view(s).

The navigation bar should show the title of the current view, along with a back button (unless root view).

I suggest you look at ng-view. It allows you to easily switch between views. Also look at the $location service. It supports the browser's forward/back buttons.

If you want more control, or you don't want the brower's address bar to change when you switch views, you can manually hook things up with ng-show and/or ng-hide to show/hide sections of the DOM. Use model/$scope properties to keep track of the current view and previous views. Here's a fiddle showing how to get started. E.g., the navigation bar might look something like this:

<button ng-hide="view == 'root'" ng-click="goBack()">< {{previousView}}</button>

And switching views:

<div ng-show="view == 'view1'">View 1
   <div><a ng-click="changeView('view1.1')">view 1.1</a>
   </div>
</div>