Join Roy Sivan for an in-depth discussion in this video Using ng-repeat to display a list of WordPress Posts, part of AngularJS and WordPress: Building a Single-Page Application.
- View Offline
- Now that we have our route list controller…and list template all defined and running,…we have to make it look pretty.…Here we have the pre-code of the API response…and you'll see the j-son that it responded with.…You'll see the data for each object,…including ID title content, and all the other stuff…that comes with the post object.…Now we're going to go over to Sublime…and actually work on this template.…I'm going to start by creating a simple article temp…and in the article and h2…which will have the post title, the render version of it.…
I also want to DIV, which will have the…post rendered version, and finally…close the article.…Now that I have one, we need to…loop through all the posts that we have.…In a normal word press template,…you would expect to see some php here…that says something like the post etc.…and that will loop through all of your post objects…for that page and display all the html that you want.…Here, we don't need any php at all.…We're just going to use a new one.…I'm going to do this, ng-repeat is the same…
In this course, Roy Sivan shows how to build a single-page web app with WordPress, AngularJS, and the WordPress REST API plugin. Roy also reviews creating controllers and routes to get a basic understanding of building a multiview single-page app. Plus, get some tips to transition your single-page app to a native mobile app with AppPresser.
- Setting up WordPress
- Creating the AngularJS components, including the controller and route
- Connecting WordPress and AngularJS
- Connecting views
- Adding and displaying custom data
- Using a plugin to show advanced custom field (ACF) data on the template