Site icon Hip-Hop Website Design and Development

Single web page functions with WordPress: routes and templates

(Learn fastidiously, this can be a query about WordPress and never about AngularJS)

I am making an attempt to make a single web page utility with AngularJS and the WordPress relaxation API.

Many issues which can be common when making a typical theme (like template hierarchy, varied settings, and many others…) appear like invalid on this case, except I determine to mirror these facets someway.

Really, I am coping with the web page templates.

Now, the issue

Some pages want a number of HTTP calls to the REST API. By instance, I’ve designed a slider for my dwelling web page; this may be configured via the theme customizer. Usually, I would just use get_theme_mod() to get an array of slides to my web page templates; on this SPA I created an endpoint to make it obtainable via the API and loaded it utilizing the $http service of AngularJS.
Identical issues occur with something that may be configured via customizer. In fact, this slows down the loading course of.

I might like to write down my partials in PHP and have the WordPress capabilities obtainable there. This would scale back the variety of calls drastically, however I could not discover a solution to do it.

It needs to be one thing that makes the template obtainable via URL; I need to use PHP for what’s equal to all of the pages and angular information for what would change. Any assistance is appreciated.

EDIT
Possibly the issue was not clear. What I truly do is utilizing a controller for every little thing I would like from the remainder API. Controllers appear like this one (sure, this one is angular code; exception dealing with was omitted to shorten it)

app.controller('allposts', perform ($scope, $http) {
    $http.get('wp-json/wp/v2/posts?_embed&per_page=6').then(perform (res) {
        $scope.standing = res.standing;
        $scope.posts = res.information;
    });
})
.controller('slider', perform ($scope, $http) {
    $http.get('wp-json/ajst/v0/homeslider').then(perform (res) {
        $scope.slides = res.information;
    });
    $scope.interval = 4500;
})
.controller('featuredproducts', perform ($scope, $http) {
    $http.get('wp-json/ajst/v0/showcase').then(perform (res) {
        $scope.merchandise =  res.information;
    });
})

All of those have customized endpoints I created however go in a single template web page. What I need is to make use of the primary one (as a lot as related controllers for single submit and web page), however load the opposite options utilizing PHP WordPress capabilities.

And so? Effectively, the routing system makes what follows not so easy. Normally, posts are known as utilizing permalinks. I wrote an angular config that mirrors the permalink construction, so posts are nonetheless obtainable utilizing the identical permalinks. But when I merely write a partial PHP template and cargo it, WordPress capabilities aren’t outlined there (after all):

$routeProvider.when('/', {templateUrl: partials.folder + 'dwelling.html', controller: 'allposts'});

(partals.folder was outlined in capabilities.php file)
The house.html is my template file with all these controllers. So, what I am searching for, is to be allowed to make use of a PHP template that is acknowledged by WordPress, however not via permalink. Thanks.