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

时间:2014-10-02 22:22:04

标签: angularjs angular-ui-router

我有一个嵌套的状态,它与目录中的文件路径相关联。也就是说,视图的网址类似于/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'
      });
  });

2 个答案:

答案 0 :(得分:2)

有一个类似的Q&答: - Recursive ui router nested views

因此,我们可以使用更精确的正则表达式def:

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

以下是带有示例

plunker

答案 1 :(得分:1)

您必须使用正则表达式进行匹配:

 url: '/{path:.*}' 

或他们的捷径语法:

url: '/*path'

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