angularJSで覚えておきたいことメモ

  • 54
    いいね
  • 0
    コメント
この記事は最終更新日から1年以上が経過しています。

ドットインストールのangularJSは罠と言われるぐらいangularJSは深いようなので、
わかったほうが良いであろうことと参考になりそうなurlを上から順にメモしておく。
自分も学んでいる途中なので改善していきたい。

なにができるのか

なにができるかざっと見ればスコープとかデータバインディングとかはわかった気になれる。
https://angularjs.org/
http://qiita.com/opengl-8080/items/2fe0a20c314b1c824cc5

ng-repeat, ng-click

このあたりも大抵のサンプルで出てくるのでざっとみればわかった気になれる。

$scope, $rootScope

$rootScopeがある。DOM構造からscopeができる。
https://docs.angularjs.org/guide/scope

controller

ng-controllerでcontrollerを指定して使う。
その範囲のscopeのふるまいを決めてあげる。
https://docs.angularjs.org/guide/controller

DI, minify化の対応

angularJSといえばDIというくらい説明に使われる。
それに関連してminify化した時に動かなくなる場合があるので対応を覚えておく。
http://qiita.com/kawaz/items/363f430d21ec729f1b7d
DIについて
http://qiita.com/kenjiSpecial@github/items/6b7db5591bb2684058d5

filter

なにか処理をかませて表示したい時とか、ng-repeatで絞込たい時とか
https://docs.angularjs.org/api/ng/filter/filter
http://qiita.com/_rdtr/items/5bf69a29e33f668168cc

template

directiveやng-includeでhtmlのパーツを呼び出せる。
http://angularjsninja.com/blog/2013/11/19/angularjs-nginclude/

railsなら以下の様なgemもある。
https://github.com/pitr/angular-rails-templates

directive

繰り返しでてくるものを部品化する感じでしょうか。
controllerを重たくしないようにdirectiveに追い出せるものは追い出す。
http://angularjsninja.com/blog/2013/11/20/angularjs-custom-directives/

  • compileとlinkの違い

service

ビジネスロジックはserviceに追い出す
http://dev.classmethod.jp/client-side/javascript/angularjs-5/
factoryとservice
http://faltc.blogspot.jp/2013/11/angularjsfactoryservice.html

resource

追加module。基本RESTなapiに対応したmodelっぽいものをさくっと書ける。
https://docs.angularjs.org/api/ngResource/service/$resource

$broadcast

大きなアプリケーションになってきたときにeventを伝播させる方法
http://qiita.com/sunny4381/items/aeae1e154346b5cf6009#2-4

router

追加module。
標準のは使いづらくてangular-ui-routerが一般的とよく聞く気がする。
https://github.com/angular-ui/ui-router

controllerAS

controllerが入れ子になってきた時に$parentで遡って行くより
controllerASを使ったほうがスマート。
http://qiita.com/konpyu/items/3555364eb53bbf5d91a5

$sce

セキュアなアプリケーションにするために基本サニタイズされていないhtmlは表示できない。
表示するときはセキュアであるという印をつけてあげる。
http://qiita.com/zoetro/items/0b01fda20f8000e485cf

その他

csrf token

webフレームワーク使うなら、大抵csrf tokenをやりとりする仕組みがあるだろうから
対応してあげなきゃいけない。
http://qiita.com/giginet/items/7b5f3e0ce181c3345a55