angularjs|ngResourceとlaravelの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
});