AngularJS/TIPS集/$http のバックアップ差分(No.1)

バックアップ一覧
現在との差分を表示
ソースを表示
バックアップを表示
AngularJS/TIPS集/$http へ行く。
- 1 (2016-02-06 (土) 08:58:12)

追加された行はこの色です。
削除された行はこの色です。


***サンプル [#f00b2868]
$httpを使ったサンプルです。
RESTの仕様は
 /api/hoge/ にHTTP GETすると一覧(JSON配列)
 /api/hoge/[id].json にGETすると詳細
 /api/hoge/ にHTTP POST すると登録
こんなよくある仕様だとします。これらに対して、

 hogeService.getHoges();
 hogeService.getHoge(id);
 hogeService.saveHoge(postData);
こんな感じでサービスを呼び出せるようにします。

***サービスの定義 [#mcdf0b8a]
 angular.module(APP_NAME)
     .factory('hogeService', ['$http', function ($http) {
         function callAjax(method, url, data) {
             console.log(data);
             var promise = $http({
                 method: method,
                 url: url,
                 data: data
             });
             return promise;
         }
 
         return {
             getHoges: function () {
                 var method = 'GET';
                 var url = '/api/hoge/';
                 return callAjax(method, url);
             },
             getHoge: function (id) {
                 var method = 'GET';
                 var url = '/api/hoge/' + id + '.json';
                 return callAjax(method, url);
             },
             saveHoge: function (postData) {
                 var method = 'POST';
                 var url = '/api/hoge/';
 
                 console.log(postData);
                 return callAjax(method, url, postData);
             }
         };
     }]);

***コントローラからの呼び出し方 [#h69ba8cd]