An extremely important part of designing AngularJS applications is the separation of responsibilities. The whole reason you choose a structured framework is to ensure that code is well implemented, easy to follow, maintainable, and testable. Angular provides a very structured framework to work from, but you still need to ensure that you implement AngularJS in the appropriate manner.
The following are a few rules to follow when implementing AngularJS:
■ The view acts as the official presentation structure for the application. Indicate any presentation logic as directives in the HTML template of the view.
■ If you need to perform any DOM manipulation, do it in a built-in or your own custom directive JavaScript code—and nowhere else.
■ Implement any reusable tasks as services and add them to your modules by using dependency injection.
■ Ensure that the scope reflects the current state of the model and is the single source for data consumed by the view.
■ Ensure that the controller code only acts to augment the scope data and doesn’t include any business logic.
■ Define controllers within the module namespace and not globally. This ensures that your application can be packaged easily and prevents overwhelming the global namespace.