Question

如果网址为/test?x=5，我想匹配此路线，如果未提供参数x（/test）则不匹配：

stateProvider.state({
    name: 'someState',
    url: '/test?x',
    template: '<div>matched</div>'
});

此配置不起作用，路由在两种情况下都匹配。我需要查询参数。

我期待这样的清洁解决方案：

stateProvider.state({
    name: 'someState',
    url: '/test',
    params: {
        x: {
            required: true
        }
    },
    template: '<div>matched</div>'
});

Answer 1

您可以在当前路由上以及从resolve函数写入解析，无论参数是否存在

stateProvider.state({
    name: 'someState',
    url: '/test?x',
    template: '<div>matched</div>',
    resolve: {
      xExists: ['$stateParams', '$state', 
         function($stateParams, $state){
            if(!$stateParams.x) $state.go('someotherstate');
         }
      ]
    }
});

其他更好的解决方案是将路线模式更改为/test/:x，这将使您的模式独一无二。如果它与路由模式不匹配，ui-router将负责导航到默认路由（如果您使用$urlRouter.otherwise配置它）。

url: '/test/:x',

仅当查询参数存在时才匹配路由

1 个答案: