Posted at

Angular.js備忘録

More than 3 years have passed since last update.

自分用の備忘録です。


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を使う