AngularJSのチュートリアルをCakePHPでやってみる。その4

4日目のソースが欲しい方はこちらです。
サンプルページはこちらです。

テンプレート内でのリンクと画像

今回はテンプレート内でaタグを使ってリンクするのと、画像を設定する所が、メインです。
つまり以下の部分がキモです。

<a href="#/phones/{{phone.id}}" class="thumb"><img ng-src="/angularjs_tutorial/{{phone.imageUrl}}"></a>
<a href="#/phones/{{phone.id}}">{{phone.name}}</a>

簡単ですね。imgタグには「src」では無く、「ng-src」で指定するようです。「src」でも普通に動いたんですけど…？

Jsonの変更

今回、JsonController.phpを修正してます。

public function api_get2($type = null){
    // リクエストをデバッグログに書き出し
    $this->ApiTool->logingRequest($this->request);
    // 引数チェック。空か、指定タイプ以外だったら404エラー
    $this->ApiTool->checkType($type,array('phones'));
    // タイプごとにphonesを作り分ける。
    if ($type == 'phones'){
     $phones = $this->__getPhones();
     // debug($phones);die;
     $this->set('phones',$phones);
    }
    // JSON用としてレスポンスを返す
    return new CakeResponse(array('body' => json_encode($phones)));
}

上のメソッドを追加してます。
JSON吐き出す部分を$this->set('_serialize', array('phones'));では無く、return new CakeResponse(array('body' => json_encode($phones))); としてます。こちらでも同じようにJsonを吐き出しますが以前のと違いは、Jsonの一番外側に「CakeResponse」で指定した場合、例えば「’phones’」が付きません。
こっちの方が都合が良いので今後はこっちを使用していくつもりです。
以下比較
serializeで作ったJSON
CakeResponseで作ったJSON

ではでは。

環境とか

項目	内容
PHPフレームワーク	Cakephp 2.2.5
CSSフレームワーク	Twitter bootstrap 2.2.2
JSフレームワーク	AngularJS 1.0.5
IDE	SublimeText 2
開発環境?	MAMP
PC	iMac
OS	Mac OS Lion