title: AngularJS Modules/Scope Sharing
body: <p>I recently started using AngularJS and the way I'm building my apps now is like this:</p>
  
  <h2>MainController.js</h2>
  
  <pre><code>var app = angular.module('app', ['SomeController', 'MainController']);
  
  app.controller('MainController', function ($scope) {
      // do some stuff
  }
  </code></pre>
  
  <h2>SomeController.js</h2>
  
  <pre><code>var SomeController= angular.module('SomeController', []);
  
  SomeController.controller('SomeController', function ($scope) {
      $scope.variable = "test";
      // do some otherstuff
  }
  </code></pre>
  
  <p>The problem that Im' running into is that the scope is not being shared between modules. From <strong>MainController</strong> I can't get the variable "test" for example.</p>
  
  <ul>
  <li>What is the best practice for this? Do I store all my controllers in 1 module in 1 file?</li>
  <li>How can i have 1 page with 2 controllers and share the <code>$scope</code> between them, or is it OK to put everything in just one controller ? </li>
  </ul>