2

WP Rest Api と AngularJs を使用してフロントエンドにデータを表示する、比較的単純なブログ ページを作成しています。

私のホームページでは、タイトル、注目の画像、抜粋を返したいと思っています。タイトルと抜粋を引っ張ってきましたが、JSON では注目の画像はメディア ID のようです。このデータをオンザフライで取り込む最良の方法は何ですか?

PHP関数を使用するインターネット上のさまざまなものを見てきましたが、それを行う最良の方法は角度コントローラー内であり、コントローラーが正確に何であるかについてのアドバイスを探しているだけだと思います

リスト ビュー HTML

<ng-include src=" dir + '/form.html?v=2' "></ng-include>
<div class="row">
    <div class="col-sm-8 col-lg-10 col-lg-push-1 post">         
        <div class="row-fluid">
            <div class="col-sm-12">
                <article ng-repeat="post in posts" class="projects">
                    <a class="title" href="#/post/{{post.slug}}"><h2>{{post.title.rendered}}</h2></a>
                    <p ng-bind-html="post.excerpt.rendered | to_trusted"></p>
                </article>
            </div>
        </div>
    </div>
</div>

コントローラ

.controller('listPage',['$scope','Posts', function($scope,Posts){

    $scope.refreshPosts = function(){
        Posts.query(function(res){
            $scope.posts = res;
        });
    };
    $scope.refreshPosts();

    // CLEARFORMFUNCTION
    $scope.clear = function(){
        $scope.$root.openPost = false;
        jQuery('#save').modal('hide');
    };


    // SAVEMODALOPEN/COSE
    $scope.openSaveModal = function(){
        jQuery('#save').modal('show');
    }

    $scope.closeSaveModal = function(){
        jQuery('#save').modal('hide');
    }

    // DATEFUNCTION
    $scope.datify = function(date){
        $scope.date = newDate(date);
        return $scope.date.getDate()+'/'+$scope.date.getMonth()+'/'+$scope.date.getYear();
    };
}])
4

3 に答える 3

6

PHP を使用して JSON 応答を変更することもできます。これは必要なものだけを返し、非常に高速です（_embed私の経験では、使用は非常に遅いです）

function.phpプラグインに次のコードがあります（カスタム投稿タイプを追加するために使用されます）が、テーマのファイルに入れることができると思います。

php

add_action( 'rest_api_init', 'add_thumbnail_to_JSON' );
function add_thumbnail_to_JSON() {
//Add featured image
register_rest_field( 'post',
    'featured_image_src', //NAME OF THE NEW FIELD TO BE ADDED - you can call this anything
    array(
        'get_callback'    => 'get_image_src',
        'update_callback' => null,
        'schema'          => null,
         )
    );
}

function get_image_src( $object, $field_name, $request ) {
    $size = 'thumbnail'; // Change this to the size you want | 'medium' / 'large'
    $feat_img_array = wp_get_attachment_image_src($object['featured_media'], $size, true);
    return $feat_img_array[0];
}

これで、JSON 応答"featured_image_src":に、サムネイルへの URL を含むという名前の新しいフィールドが表示されます。

レスポンスの変更について詳しくは、http:
//v2.wp-api.org/extending/modifying/をご覧ください。

wp_get_attachment_image_src()関数 の詳細については、https://developer.wordpress.org/reference/functions/wp_get_attachment_image_src/をご覧ください。

<?php ?>**注:これが新しい php ファイルである場合は、タグを忘れないでください!

于 2016-12-19T20:33:45.437 に答える
3

私の場合、二次的なリクエストを行うことなくこれを解決する新しいプラグインが利用可能であることがわかりました。最近の Q を参照してください:

WP Rest API + AngularJS:ページに表示するアイキャッチ画像を取得する方法は?

于 2015-10-24T16:24:11.117 に答える