前置き

もう少しで開発が一区切りつきそうなので、
苦戦したMVCモデルの扱い方についてまとめます。

担当はIoT機器操作用のwebアプリを作ること。
私がチームに加わる前に、
ある程度アプリは作られていてAngularJSが使われていました。

全担当から業務を引き継いだ時は、大体基本的なモデルのような感じでした。

ここに、ガンガン機能を追加して行きたいという事だったので
MVCモデルの分割をしていきたいな、と思ったけど
MVCの知識がほぼ0でなかなか上手く行かず。。

本記事では、試みとつまづいた点、最終的に落ち着いたモデルを記載します。
お急ぎであれば、まとめを見てください。

試み1 - コントローラーの分割

やった事

MVCの分割をググったら、まず１番にコントローラーの分割が出てきたので
ビューの機能に合わせて愚直にコントローラーを分割した。

困った事

コントローラーだけ分割すると、
機能により、使うモデル使わないモデルが出来て
各コントローラーで不要なモデルを読み込む事になった。
いわゆるモデルの肥大化をした。

試み2 - モデルの分割

やった事

モデルが大きくなったので、機能に合わせてモデルも分割した。
+各機能で使いたい共通のモデル枠も用意した。(MMVCを履き違えた。)

困った事

今度は共通モデルを触るための処理を、各コントローラーに書く事になってしまった。
変更があった時に各コントローラーに手を入れないといけなくなった。。

試み3 - サービスの作成

やった事

共通のモデルを触るようのコントローラーを作成した。
各機能のコントローラーから共通モデルに変更を加える時は、
共通コントローラーを使うようにした。
共通モデルに変更があった時は、ブロキャスして各機能のモデルに反映するpush型にした。
ビューからモデルを見る時は、共通のモデルを直接参照せずに済むようにした。このpush型がスッキリするポイントになったと思う。気に入ってる。

見出しに「サービスの作成」と書いたけど、
共通モデルと共通コントローラーをまとめて、サービスとして機能を提供した。

まとめ

↓最終的に落ち着いたモデル

やって効果的だったこと

機能に合わせて、モデル/ビュー/コントローラー全部分割。
共通で使うモデル/コントローラーは、サービスorファクトリーにする。
共通モデルは、ビューから直で参照しない。各機能のモデルに落とす。
(ブロキャスpush型オススメ。)