Question

ui-router optional param without trailing slash 并且How to define optional parameter using UI-Router without trailing slash as well?没有足够的参数且无效（至少对于我的场景，即没有尾随斜杠的角度路线的工作链接（href））答案。

Live Demo Link

以下是示例html链接

 <div>
    <a ui-sref="home">Home</a> 
    | <a href="#/posting/">Post 1</a>
    | <a href="#/posting">Post 2</a>
    | <a href="#/posting/sami">Post 3</a>
    | <a ui-sref="post">Post 4</a>
    | <a ui-sref="post({nam:'sami'})">Post 5</a>        
</div>

除了 Post 2 之外，上述所有链接都正常工作，因为我有一个可选参数，因此链接至少需要一个斜杠

我使用的是stateprovider，state似乎是

name: 'post',
val: {
    url : '/posting/:nam',
    views: {
        v1: {
         template: '<h4>Posting <label ng-if="stateParams.nam">{{stateParams.nam}}</label> </h4>',
         controller: 'post',
            resolve: {
              deps: function ($ocLazyLoad) {
                  return $ocLazyLoad.load([{ name: appName, files: ['post.js'] }]);
              }
            }
        },
        params: {
            nam: { squash: true, value: null }
        }
    }
 }

如果我只能选择使用链接href而不是ui-sref

，我怎样才能拥有无尾随斜杠的有效链接

Answer 1

您可以在配置

中使用$urlMatcherFactoryProvider.strictMode(false);

Answer 2

如果你喜欢我试过@ egor.xyz解决方案，它不起作用。检查ui-router Frequent Questions，您会发现以下内容：

对于旧版本的ui-router，请将此代码段添加到模块的配置功能中。它在$ urlRouterProvider上创建一个规则，该规则将所有缺少尾部斜杠的URL映射到同一个URL，但附加了尾部斜杠。

$urlRouterProvider.rule(function ($injector, $location) {
    var path = $location.url();

    // check to see if the path already has a slash where it should be
    if (path[path.length - 1] === '/' || path.indexOf('/?') > -1) {
        return;
    }

    if (path.indexOf('?') > -1) {
        return path.replace('?', '/?');
    }

    return path + '/';
});

为我工作。

Angular Url没有带有可选参数的斜杠

2 个答案: