title: Why won't these AngularJS apps run together?
body: <p>I have one successfully running AngularJS app that I build as a standalone "CreateUser" widget. I'm making a second widget "ViewUsers" which would be a table of current users (the end goal being to tie them together or keep separate depending on the page the user's on).</p>
  
  <p>Anyway, my first app runs fine, but when I put the second app, the second app won't run. Even a simple <code>&lt;input ng-model="test" /&gt;{{test}}</code> won't work.</p>
  
  <p>**EDIT: It seems that calling <code>$scope.loadUsers();</code> is causing the error. In this case, how would I call a loading function to run in the constructor function?</p>
  
  <p>Here's a Fiddle and my code: <a href="http://jsfiddle.net/YYcna/" rel="nofollow">http://jsfiddle.net/YYcna/</a></p>
  
  <p>HTML (minus html / head)</p>
  
  <pre><code>&lt;body ng-app&gt;
      &lt;fieldset&gt;
          &lt;legend&gt;Create new user&lt;/legend&gt;
          &lt;form ng-submit="createNewUser()" ng-controller="CreateUsers" enc-type="multipart/form-data" method="POST" action=""&gt;
              &lt;select ng-model="selectedType" ng-options="type as type for type in types" name="type"&gt;&lt;/select&gt;
              &lt;input style="display:block;" ng-repeat="field in fields[selectedType]" type="text" name="{{field.value}}" ng-model="formData[field.value]" placeholder="{{field.name}}" /&gt;
              &lt;input type="submit" value="Create" /&gt;
          &lt;/form&gt;
      &lt;/fieldset&gt;
  
      &lt;fieldset&gt;
          &lt;legend&gt;All users&lt;/legend&gt;
          &lt;div ng-controller="ViewUsers"&gt;
              &lt;input type="text" ng-model="test" /&gt;{{test}}
          &lt;/div&gt;
      &lt;/fieldset&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>JAVASCRIPT</p>
  
  <pre><code>/**
   * User creation controller. 
   * 
   * @param {type} $scope
   * @param {type} $http
   * @returns {undefined}
   */
  function CreateUsers($scope, $http, $rootScope){
      $scope.selectedType = '';
      $scope.formData = {};
      $scope.method = 'POST';
      $scope.url = '/users/createUser';
      $scope.types = [
          'Student',
          'Parent',
          'Teacher',
          'Staff'
      ];
  
      $scope.fields = {
          User:[
              {name: 'First Name', value: 'first_name'},
              {name: 'Last Name', value: 'last_name'},
              {name: 'Email', value: 'email'},
              {name: 'Phone', value: 'phone'}
          ],
          Employee:[
              {name: 'Start Date', value:'start_date'},
              {name: 'Branch', value:'branch'}
          ]
      };
      $scope.fields.Student = $scope.fields.User;
      $scope.fields.Parent = $scope.fields.User;
      $scope.fields.Employee = $scope.fields.User.concat($scope.fields.Employee);
      $scope.fields.Teacher = $scope.fields.Employee;
      $scope.fields.Staff = $scope.fields.Employee;
  
  
      $scope.createNewUser = function(){
          this.formData.type = this.selectedType;
          console.log($scope);
          console.log($scope.formData);
  
          $http({
              method: $scope.method,
              url:    $scope.url,
              data:   $scope.formData
          }).success(function(data,status){
              $scope.status = status;
              $scope.data = data; 
              console.log($scope);
          }).error(function(data,status){
              $scope.data = data || 'Request failed';
              $scope.status = status;
              console.log($scope);
          });
      }
  }
   /**
   * View users controller
   *
   * @param {type} $scope
   * @returns {undefined} 
   */
  function ViewUsers($scope, $http){
      $scope.users = [];
      $scope.url = '/users/getUsers'
      $scope.test = 'checken';
  
      $scope.loadUsers();
      console.log('loaded view users');
      $scope.loadUsers = function(){
          $http({
              method: 'GET',
              url: $scope.url
          }).success(function(data, status){
              $scope.status = status;
              $scope.data = data;
              console.log($scope.data);
          }).error(function(data, status){
              $scope.data = data || 'Request failed';
              $scope.status = status;
              console.log($scope.data);
          });
          console.log('attempted to get users');
      }
  }
  </code></pre>