title: Multiple controllers with AngularJS in single page app
body: <p>I want to know is how to use multiple controllers for a single page application. I have tried to figure it out and I've found questions very similar to mine, but there is just a ton of different answers solving a specific problem where you end up not using multiple controllers for a single page app.</p>
  
  <p>Is that because it would not be wise to use multiple controllers for a single page? Or is it just not possible?</p>
  
  <p>Let's say I already have a kick-ass image carousel controller working the main page, but then I learn how to (let's say) use modals and I need a new controller for that as well (or any other thing I need a controller). What will I do then?</p>
  
  <p>I have seen some answers to other questions where they ask about almost the same things as me and people answer "*OMG. Why would you even do that, just do this...". </p>
  
  <p>What is the best way, or how do you do it?</p>
  
  <p><strong>Edit</strong></p>
  
  <p>Many of you are answering to just declare two controllers and then use ng-controller to call it.
  I use this bit of code below and then call MainCtrl with ng-controller. </p>
  
  <pre><code>app.config(function($routeProvider, $locationProvider) {                        
    $routeProvider                                                                
         .when('/', {                                            
           templateUrl: "templates/main.html",                                               
           controller:'MainCtrl',                                
          })                                                                      
          .otherwise({                      
              template: 'does not exists'   
          });      
  });
  </code></pre>
  
  <p>Why do I even need to set a controller here if I can just use ng-controller without it? This is what confused me. (and you can't add two controllers this way, I think...)</p>