0

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 - Not Foundページを表示します。

それで、何が悪いのですか?

更新番号 1

スラッグ投稿のスラッグをパラメーターとして送信すると問題が発生しますが、投稿の ID を使用して投稿を取得すると、問題なく動作します。だから、wp-api のスラッグに何か問題があると思います。

更新番号 2

コントローラーは次のようになります。

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;
  });
};
4

1 に答える 1

1

ブログ記事のURLでしょうか?/:slug ではなく、/blog/:slug にするべきですか?

URL 経由ではなく、状態とスラッグを直接指定するため、リンクをクリックするだけで機能します。

于 2016-02-07T15:29:23.503 に答える