【AngularJS】ng-appを複数共存させる方法。

まず大前提として。

1, ngAppディレクティブの入れ子は出来ません。
2, angularは一番はじめに見つけたngApp以外は自動で起動してくれません。

というのを踏まえると入れ子は厳禁、そして2つ目以降のアプリケーションは自分で起動する必要がある。
のでこうする。

// jQueryが読み込まれていると仮定
angular.element(document).ready(function() {
    angular.bootstrap($('.targetElement'), ['myApp']);
});

angular.bootstrap()の第1引数にはngApp属性が指定されているエレメントを渡す。
※この例ではjQueryが読み込まれていることを前提として$関数にセレクタを渡し、エレメントを参照させている。
そして第2引数に起動したいアプリケーション名(今回はmyAppと仮定)を指定すれば良い。

これで複数のアプリケーションを起動させることが出来る。