Angular UI-Router解析包含作为状态一部分的斜杠的URL

Question

我有一个嵌套的状态与目录内的文件路径相关联。也就是说，该视图的网址类似于/workspace/path/to/my/file.txt。现在，仅仅使用/:path不起作用。如何将ui-router配置为在路径中间接受斜杠？

angular.module('myApp') 
    .config(function ($stateProvider) { 
    $stateProvider 
     .state('workspace.file', { 
     url: '/:path', 
     parent: 'workspace', 
     views: { 
      fileTabs: { 
      templateUrl: 'app/workspace/workspace.file/file.html', 
      } 
     }, 
     controller: 'WorkspaceFileCtrl' 
     }); 
    }); 

Answer 1

你必须使用一个正则表达式匹配：

url: '/{path:.*}' 

或其快捷包罗万象的语法：

url: '/*path' 

https://github.com/angular-ui/ui-router/wiki/URL-Routing

Answer 2

有类似Q &答： - Recursive ui router nested views

所以，我们可以用更精确的正则表达式高清：

.state('workspace.file', { 
     url: '/files/{folderPath:[a-zA-Z0-9/.]*}', 
     templateUrl: 'tpl.files.html', 
     controller: 'FileCtrl' 
    }); 

这里是plunker用一个例子