如何让我的wordpress站点在同一页面上显示博客文章，而不使用AngularJS加载新页面？

Question

我一下午的大部分时间都在努力让这个工作。当我使用静态页面时，我设法让它工作，但是每当我试图让它在重复加载帖子时工作，它就会在新的页面中打开帖子。我想让它做的是在同一个页面中打开那个帖子，而不加载页面。

有人能给我指个正确的方向吗？下面是我当前的代码。

Media.js

var mediaApp = angular.module('mediaApp', ['ngRoute']);

mediaApp.config(function($routeProvider, $locationProvider) {
    $routeProvider
        .when('/', {
            templateUrl: '/pages/posts.html',
            controller: 'mediaCtrl'
        })
        .when('/:slug', {
            templateUrl: '/pages/single-post.html',
            controller: 'Content'
        })
        .otherwise({
            redirectTo: '/'
        });
    })

mediaApp.controller('mediaCtrl', function($scope, $http, $routeParams) {
        $http.get('wp-json/wp/v2/mediacentre').success(function(res){
            $scope.mediacentre = res;
        });
})

mediaApp.controller('Content',
        ['$scope', '$http', '$routeParams', function($scope, $http, $routeParams) {
            $http.get('wp-json/wp/v2/mediacentre/?filter[name]=' + $routeParams.slug).success(function(res){
                $scope.mediacentr = res[0];
            });
        }
    ]
);

剪报。html

<ul>
    <li ng-repeat="mediacentr in mediacentre">
        <a href="{{mediacentr.slug}}">
            {{mediacentr.title}}
        </a>
    </li>
</ul>

single-post.html

<h1>{{post.title}}</h1>
{{post.content}}

archive-media-centre.php

<?php get_header(); ?>
<div class="media-main" ng-app="mediaApp" ng-controller="mediaCtrl">
    <div ng-view></div>
</div>

<script src="/js/media.js"></script>

</div>
<?php get_footer(); ?>

在此方面的任何帮助都将不胜感激。

Answer 1

我设法找到了这个问题的解决办法。事实证明，我需要更改基本url的地方非常简单。

<base href="/media-centre/"></base>