javascript - ui-router 激活 404 而不是请求状态

Question

我正在使用 WordPress Rest API，并且我的 AngularJS 应用程序中的状态如下:

    .state('public.blog', {
        abstract: true,
        url: '/blog',
        template: '<ui-view/>',
    })
    .state('public.blog.home', {
        url: '/',
        templateUrl: 'public/blog.html',
        controller: 'PublicBlogCtrl',
        controllerAs: 'vm',
    })
    .state('public.blog.post', {
        url: '/:slug',
        templateUrl: 'public/blog.post.html',
        controller: 'PublicBlogPostCtrl',
        controllerAs: 'vm',
    })

例如，我有一篇类似“http://example.com/blog/what-is-angularjs”的文章'。当我单击应用程序中的链接时，它工作正常，如下所示:

<a ui-sref="public.blog.post({ slug: post.slug })">

但问题是当我写 URL ' http://example.com/blog/what-is-angularjs 时' 直接在浏览器地址栏中。当我这样做时，Angular 无法处理 URL 并将其识别为与任何状态都不匹配的错误 URL，然后它会查找 $urlRouterProvider.otherwise('/404'); 和显示我的 404 - 未找到 页面。

那么，这是怎么回事呢？

UPD#1

当我将 slug 帖子的 slug 作为参数发送时，会出现问题，但是当我使用帖子的 ID 来检索帖子时，它工作正常。所以我认为 wp-api 的 slug 中有些问题。

UPD #2

Controller 看起来像这样:

function PublicBlogPostCtrl($scope, $stateParams, WPService) {
  var vm = this;

  WPService.getPost($stateParams.slug).success(function(res) {
      $scope.post = res[0];
  }).error(function(err) {
      console.error(err);
  });
}
app.controller('PublicBlogPostCtrl', PublicBlogPostCtrl);

以及 WPService.getPost 如下:

WPService.getPost = function(slug) {
  return $http.get('wp-json/wp/v2/posts/?filter[name]=' + slug).success(function(res, status, headers) {
      return res;
  }).error(function(err) {
      return err;
  });
};

Answer 1

这可能是博客文章的网址吗？而不是/:slug，应该是/blog/:slug 吗？

它可以通过单击链接来工作，因为您直接提供状态和 slug，而不是通过 URL。