自分用の備忘録です。

angular.moduleの使い方

angular.moduleの使い方を覚えないと思わぬところでつまづきます。

サーバのRESTAPIからデータを取得するために、$resourceを用いてAPIを叩きにいったのですが、なぜか動きませんでした。

画面に何も表示しなくなり、ブラウザのConsoleにエラーも表示されませんでした。

service/test.js

var TestService = angular.module('TestService',['ngResource']);

TestService.factory('Test',['$resource',function ($resource) {
            return $resource('http://localhost/api/test/:id',{},{
                  query: {method: 'GET', isArray: true},
                  show: {method: 'GET'},
                  save: {method: 'POST'},
                  update: {method: 'PUT'},
                  remove: {method: 'DELET'}
            });
      }
]);

Yeomenでangularの雛形を作り、$resourceの使い方を調べ、上記のようなjsを書きました。

かなり悩んだ結果動かなくなった理由は、['ngResource']を指定しているためでした。app.js内で既に宣言されているので、ここではいらないみたいです。

サンプルを調べると大体追加されているので、気づくのに時間がかかりました。

ついでにmoduleについて調べたんですが、
TestServiceという名前で他のmoduleも宣言していた場合、第2引数になにも指定しないと、先に宣言されたmoduleを取得しにいくらしいです。

第2引数に[]を指定すると、moduleの新規作成を行い、既にmoduleが存在する場合は、上書きするような挙動になるらしいです。

参考

angular.moduleの落とし穴
 angular.js–resourceを使う