読者です 読者をやめる 読者になる 読者になる

AngularJS のデータの渡し方

イシュー

  • AngularJSでのデータの渡し方は、シングルトンオブジェクト(Factory)を使って渡すやりかたをちらほら見るが、このやり方が本当によいか考えたい。
  • 今のやり方は、コントローラにデータを渡す際に、受け取ったシングルトンオブジェクトが正しい前提で$scopeの変数に代入している。この場合、間違ったデータで上書きしてしまってもわからない。
    • $scopeがグローバルなので、別のコントローラで使っている領域を触る可能性がある。
      • 0512追記:$scopeはグローバルではない。factoryのシングルトンオブジェクトを介しているからグローバルに見えるだけ
    • しかし $scopeに変数を代入しないと、templateで使用できない。
  • コントローラで $scopeではなく、thisを使っている例をみるが、この内容についても理解する
    • 0512追記:$scopeはグローバルではないから、thisと同じ。シンタックスシュガー

参考

問題点

  • 問題点は、シングルトンオブジェクトを渡すことによるDIではなくて、渡されたDIをグローバルの$scopeに代入するところに問題がある。
  • プライベートな名前空間で、テンプレートにデータを表示する方法はないか?
    • テンプレートから呼び出せる プライベートな $scope に代わるデータ表示手段
    • (案1)コントローラ間で名前が被らないように$scopeの下のオブジェクト名をルール化する

対応案

そもそも Factoryのオブジェクトが初期化されているのがおかしい

  • どうやら今の私のプログラムの状態がおかしい模様

    • AngularJS的には、$scopeはグローバルではなく、コントローラ単位でプライベート
  • 以下の例だと、Factoryオブジェクトはシングルトンでデータを維持したまま値の複数のコントローラで使用が可能

$modal.openした時の$scopeが怪しい

  • $modal.open しただけでは、Factoryオブジェクトが消えることはない
    • おそらく、ajaxによる非同期通信を行った場合に、Factoryオブジェクトの同期が行われていない気がする(要確認)
  • $modal.openした場合は、$scope経由でデータを渡せるので、$scopeで渡すようにする

参考