Simple Angular integration with the WP REST API. Takes an endpoint and binds it to scope so you can use mustache in your templates and the WordPress HTML editor.
Benson accepts a local endpoint from your wordpress install, binds the result to scope and makes that available to your templates and the WordPress HTML editor.
Supports ACF.
- Upload benson to the
/wp-content/plugins/
directory - Activate the plugin through the 'Plugins' menu in WordPress
- Add an endpoint to a post or page
- Check any modules you want to include
- Write your controllers in a wordpress template or within the HTML editor.
Use this for now. Eventually it'll be part of core.
Use ng-app="benson" and ng-controller="MainController" like this:
<div ng-app="benson">
<div ng-controller="MainController">
{{title}}
{{content}}
</div>
</div>
<div ng-app="benson" ng-controller="MainController">
<form class="form-inline">
<input ng-model="query" type="text" placeholder="Filter by" autofocus>
</form>
Showing {{(data | filter: query).length}} of {{data.length}} posts.
<div ng-repeat="post in data | filter: query">
<h1>{{post.title}}</h1>
<div ng-bind-html="post.content">{{post.content}}</div>
</div>
</div>
<div ng-app="benson" ng-controller="MainController">
<form class="form-inline">
<input ng-model="query" type="text" placeholder="Filter by" autofocus>
</form>
Showing {{(data | filter: query).length}} of {{data.length}} posts.
<div dir-paginate="post in data | itemsPerPage: 5 | filter: query">
<h1>{{post.title}}</h1>
<div ng-bind-html="post.excerpt">{{post.excerpt}}</div>
</div>
<dir-pagination-controls></dir-pagination-controls>
</div>
Check out the Angular docs for more info.
use ng-bind-html like this
<div ng-bind-html="content"></div>
Because he is a gumball machine, also known as The Park's manager. [source]
v1.1.1 Add support for loading animations
v1.1 Added pagination module option https://github.com/michaelbromley/angularUtils/tree/master/src/directives/pagination