为什么AngularJS会从搜索栏中删除部分网址

jro*_*sav 4 html javascript angularjs angular-ui-router

我正在尝试为CRUD站点设置状态提供程序.

当我转到www.mysite.com/posts/mypostURL时被截断到www.mysite.com/mypost并且它不会触发控制器.当我使用AngularJS的routeProvider时,此错误不会持续存在,但默认提供程序不够强大,无法满足我的要求.我假设在stateProvider决定下一步做什么之前会截断URL,但我不知道是什么导致了它.如何阻止stateProvider(或其他罪魁祸首)截断?

以下是代码的一部分.

$stateProvider.state('posts',{
  url: '/posts',
  templateUrl: localized.partials + '/post-list.html',
  controller: 'loopController'
}).state('post',{
  url: '/posts/:post/',
  templateUrl: localized.partials + "/post-single.html",
  controller: 'singlePostController'
}).state('pages',{
  url: '/pages',
  templateUrl: localized.partials + '/page-list.html',
  controller: 'pagesController'
}).state('page',{
  url: '/pages/:page',
  templateUrl: localized.partials + '/page-single.html',
  controller: 'singlePageController'
});


app.controller('singlePostController', 
['$scope', '$stateParams', 'Post', function ($scope, $stateParams, Post) 
{
  $http.get(resturl +'/posts/'+$stateParams.post).
    success(function(s){
      console.log(s);}).
    error(function(e){
      console.log(e)});
}
]);
Run Code Online (Sandbox Code Playgroud)

scn*_*iro 5

post国家的尾随斜线是造成你悲痛的原因.要直接激活该状态,您需要遵循您定义的模式 - 包括尾部斜杠.这看起来像......

www.mysite.com/posts/mypost/

你有一些选择来解决这个问题.您可以从状态定义中删除尾部斜杠......

}).state('post',{
    url: '/posts/:post'
    ...
Run Code Online (Sandbox Code Playgroud)

或者按照ui-router FAQ页面上的建议实现以下逻辑来处理这个问题

如何:为所有路径选择一个尾部斜杠

这实际上驱动了一些额外的配置,如下所示

$urlMatcherFactoryProvider.strictMode(false);

$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 + '/';
});
Run Code Online (Sandbox Code Playgroud)

注意:必须使用尾随/重新定义app/scripts/app.js中的所有路由.这意味着诸如/ things /:id的路由也变为/ things /:id /