接受指定状态URL后的任何进程字符

Question

我使用的是ui-router，我的一个状态URL可以附加一个动态键。所以这个州是这样的：

.state('reset-password', {
    url: '/reset-password/{.*}',
    template: require('html-loader!./features/forgot-password/html/reset-password.tpl.htm'),
    controller: 'ResetPasswordController',
    controllerAs: '$ctrl',
}) 

但网址可能是/reset-password/134042?emailAddress=email@email.com。

但是，如果输入该状态，则不会识别状态，并且通过加载/login状态来默认状态：

$urlRouterProvider 
    .otherwise("/login")

问题

如何允许在/reset-password之后进行任何动态URL

Answer 1

如果希望URL的尾部部分与状态匹配，则可以使用以下任何一种(等效的)语法：

• /reset-password/{path:.*}
• /reset-password/*path

需要注意的常见事项是，尾随部分绑定到名称(即path)。

然后，您应该能够通过控制器中的$stateParams来访问它。

或者，如果您想让ui-router做更多解析出URL参数的繁重工作，您也可以这样做。

其中包括以下一些办法：

​

angular
  .module('app', ['ui.router'])
  .config(function ($stateProvider) {
    $stateProvider
      .state({
        name: 'reset-password1',
        url: '/reset-password1/*path',
        controller: function ($stateParams) {
          this.path = $stateParams.path;
        },
        controllerAs: '$ctrl',
        template: '<pre>path={{$ctrl.path}}</pre>'
      })
      .state({
        name: 'reset-password2',
        url: '/reset-password2/:id?email',
        controller: function ($stateParams) {
          this.id = $stateParams.id;
          this.email = $stateParams.email;
        },
        controllerAs: '$ctrl',
        template: '<pre>id={{$ctrl.id}} email={{$ctrl.email}}</pre>'
      });
  });

<div ng-app="app">
  <a ui-sref="reset-password1({ path: '134042?email=email@email.com' })" ui-sref-active="active">Reset Password (1)</a>
  <a ui-sref="reset-password2({ id: 134042, email: 'email@email.com' })" ui-sref-active="active">Reset Password (2)</a>
  <ui-view></ui-view>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.0/angular.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.28/angular-ui-router.min.js "></script>

​