今回は、「$http」オブジェクトを使用してphpへの非同期リクエストを送信したいと思います。
ちなみに、前回はngRouteを指定して画面遷移に関して記載しいました。
作成中のページはこちらです。(AngularJS + BootStrap)
httpを使う
参考サイトによると、大雑把に下のようなコードでリクエストをサーバー側に送るようです。
$http({ method: 'GET', url: 'phpへのURL', params: { name: $scope.name } }) // 2成功時の処理(ページにあいさつメッセージを反映) .success(function(data, status, headers, config){ $scope.result = data; }) // 3失敗時の処理(ページにエラーメッセージを反映) .error(function(data, status, headers, config){ $scope.result = '通信失敗!'; }
なので、非同期通信用(リクエストに対してJSONを返却するPHP)を作成する必要があります。
今回は、サイトマップの画面を作成しようと思いますので、WPのカテゴリ一覧を JSONで返却する処理を作成したいと思います。
PHP処理を作成する
こちらのサイトによると下のようなコードで行けるようです。
<?php $category = get_the_category(); $cat_id = $category[0]->cat_ID; $cat_name = $category[0]->cat_name; $cat_slug = $category[0]->category_nicename; ?>
シンプルに引数なしの一覧を返すようです。
しかしこれに、URLも欲しいのでもう1つ処理を呼び出します。PHPドキュメント参照
<?php // 指定したカテゴリーの ID を取得 $category_id = get_cat_ID( 'カテゴリー名' ); // このカテゴリーの URL を取得 $category_link = get_category_link( $category_id ); ?> <!-- このカテゴリーへのリンクを出力 --> <a href="<?php echo esc_url( $category_link ); ?>" title="カテゴリー名">カテゴリー名</a>
そして、複数のカテゴリ一覧を取得するにはget_categories
を使用するみたいです。
まとめると下のようなコードで良いことになります。
$categies = get_categories(); $cat_id = $categies[0]->cat_ID; $cat_name = $category[0]->cat_name; // このカテゴリーの URL を取得 $category_link = get_category_link( $cat_id ); // JSON文字列を出力 echo json_encode($category_link);
しかし、カテゴリ一覧なので、ループ処理を入れてやる必要があります。
PHPのループ処理を入れてやればうまく動きそうです。
実装の部分は後日にします。
でわでわ。。。