Angularjs - single vs multiple ng-app?

Question

I'm working on a web app. It's backended by Spring from controllers to database. Currently I handle page navigation using get methods from the Spring MVC controllers to access the pages.

I'm planning to use angular JS to do my UI work. I've looked up examples on how to do it and it's all good but I'm not sure about something...

ng-app

1- Should I use one per app or one per page or it doesn't matter?

2- If it doesn't matter when should I decide?

I see examples using it on the html tag and some others using in divs but I'm not sure how to decide that maybe due a lack of understanding about the framework.

Answer 1

1- Should I use one per app or one per page or it doesn't matter?

No, never use app per page, angular takes time to bootstrap whole app, and with server rounting it even doesn't make sense of writing ng application, here's interesting question about that, and it will be quite hard to maintain each application separately
Separate each logic into it's own module, but still have single starter/bootstrapper

2- If it doesn't matter when should I decide?

It matters

Some tips

• Angular has good extensibility, when app is done, and after a while you decide to add something new, it's much easy.
• Using multiple modules let's you divide app into small chunks, so when something fails, you definitely know which module caused it.
• Using angular with Server-side MVC frameworks are real pain, although it's possible, i wouldn't recommend to do that. I mean don't use jsp or thymrleaf, just use REST (better RESTful, easy use with $resource) api of you spring
• Write tests although it's javascript, writing tests give you confidence about app parts/modules. Have high test coverage is like being like a boss
• Don't belive you can start doing great apps, you must read angular, watch tutorials, read articles/blogs/stackoverflow. It has many pitfalls, and strange learning curve, but it's worth it.