omachizura

仕事メモ、役に立ったスキルをまとめています。


ngResourceとRoute::resourceを組み合わせる

laravelのResourcefulルーティングとangularjsのngResourceを組み合わせて効率よくデータのやりとりをする方法を紹介します。

まずroutes.phpにResourceルーティングを定義します。onlyで使用したいルートのみ定義することができます。

Route::resource('test', 'TestController', array('only' => array('index', 'store', 'show', 'update')));

サーバにアクセスする処理としてTestServicefactoryで定義します。

コントローラで取得・登録・更新などをシンプルに記載することができます。

var app = angular.module('app', ['ngResource']); //ngResourceを追加します

//factoryを定義します
app.factory("TestService", function($resource){
  return $resource('/test/:id', { id: '@id' }, {
    update: {
      method: 'PUT'
    }
  });
});

app.controller('TestController', function ($scope, TestService){
  //下記のようにresourceにアクセスできます
  TestService.get({ id: $scope.id }); //1件取得 show
  TestService.query(); //取得 index
  TestService.save($scope.input); //登録 store
  TestService.update($scope.input); //更新 update
});