He implementado una aplicación de página única angularjs usandoenrutador ui.

Originalmente identifiqué cada estado usando una url distinta, sin embargo, esto hizo que las urls fueran poco amigables y llenas de GUID.

Así que ahora he definido mi sitio como una máquina de estado mucho más simple. Los estados no se identifican mediante las URL, sino que simplemente se cambian según sea necesario, de esta manera:

Definir estados anidados

angular
.module 'app', ['ui.router']
.config ($stateProvider) ->
    $stateProvider
    .state 'main', 
        templateUrl: 'main.html'
        controller: 'mainCtrl'
        params: ['locationId']

    .state 'folder', 
        templateUrl: 'folder.html'
        parent: 'main'
        controller: 'folderCtrl'
        resolve:
            folder:(apiService) -> apiService.get '#base/folder/#locationId'

Transición a un estado definido

#The ui-sref attrib transitions to the 'folder' state

a(ui-sref="folder({locationId:'{{folder.Id}}'})")
    | {{ folder.Name }}

Este sistema funciona muy bien y me encanta su sintaxis limpia. Sin embargo, como no estoy usando URL, el botón de retroceso no funciona.

¿Cómo mantengo mi máquina de estado ordenada del enrutador ui pero habilito la funcionalidad del botón Atrás?