0
WordPressの投稿をインストール済みのプラグインWP-REST v2で表示して、トラフAngularJSのデータを取得したいのですが、問題があります。私はそれを表示することはできませんし、この記事に従ってコード化しました。WPJsonがangularJSで表示されていません
https://amielucha.com/angularjs-json-rest-api-with-wordpress
だから私の主なトピックは、どのようにこれをangularjsです。
これらは私のコードです：
app.js：
(function() {
var app = angular.module('app', ['ngRoute']),
api = {};
// JSON content Location
api.query = 'http://myy.website/dlrz/wp-json/wp/v2/posts/';
app.config([ '$routeProvider', '$locationProvider', '$qProvider', function($routeProvider, $locationProvider, $qProvider) {
// Enable HTML5 Mode
$locationProvider.html5Mode(true);
// configure routing
$routeProvider
.when('/', {
templateUrl: myLocal.partials + 'main.html',
controller: 'Main'
});
$qProvider.errorOnUnhandledRejections(false);
}]);
// Set Controller and get JSON-Data
app.controller('Main', [ '$scope', '$http', '$routeParams', '$sce', function($scope, $http, $routeParams, $sce) {
$http.get(api.query).then(function(res){
$scope.posts = res;
// interate through each field to set it as trusted
angular.forEach(res, function(value, key) {
// trust each title and excerpt in the object
this[key].title.rendered = $sce.trustAsHtml(value.title.rendered);
this[key].excerpt.rendered = $sce.trustAsHtml(value.excerpt.rendered);
}, $scope.posts);
console.log($scope.posts);
console.log($sce);
});
}]);
})();
main.htmlと：
<section>
<article class="well" ng-repeat="post in posts">
<header>
<h1 ng-bind-html="post.title.rendered">
{{post.title.rendered}}
</h1>
</header>
<div class="post-content" ng-bind-html="post.excerpt.rendered">
{{post.excerpt.rendered}}
</div>
</article>
のindex.php：
<?php /*get_header(); */?>
<!DOCTYPE html>
<html ng-app="app">
<head>
<!-- Required meta tags always come first -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<base href="<?php echo site_url();?>/">
<title>
<?php bloginfo('name'); ?>
</title>
<?php wp_head(); ?>
</head>
<body>
<h1>Hello World!</h1>
<div ng-view></div>
<footer>
© <?php echo date('Y'); ?> Dart Liga Verband Zürich
</footer>
</body>
</html>
<?php wp_footer(); ?>
<?php/* get_footer(); */?>
これはjsonファイルです。 http://myy.website/dlrz/wp-json/wp/v2/posts
を取得またはあなたがいただきました！$ scope.postsためにconsole.log確認した任意のエラーがあるべきか？ –
$ http.getから約束を解決したら、すぐに '$ scope.posts = res'を設定します。後で結果をループしている場合は、これをやりたくはありません。どの部分がうまくいかない？データを取得していますか？それをビューに表示しますか？ –
$ scope.postsを削除しましたが、ビューに表示できなくなりました。コンソールで見ることができます：http://myy.website/dlrz/ –