I have a fully functioning AngularJS app that I developed as a standalone "CreateUser" widget. Now, I am working on creating a second widget called "ViewUsers," which will display a table of current users (with the intention of connecting them or keeping them separate based on the user's page).
However, while my first app is running smoothly, the second app seems to encounter issues. Even a simple
<input ng-model="test" />{{test}}**UPDATE: It appears that calling $scope.loadUsers(); is causing the error. How can I invoke a loading function to run in the constructor function?
Here is a Fiddle link and the code snippet: http://jsfiddle.net/YYcna/
HTML Structure (excluding html/head tags)
<body ng-app>
<fieldset>
<legend>Create new user</legend>
<form ng-submit="createNewUser()" ng-controller="CreateUsers" enc-type="multipart/form-data" method="POST" action="">
<select ng-model="selectedType" ng-options="type as type for type in types" name="type"></select>
<input style="display:block;" ng-repeat="field in fields[selectedType]" type="text" name="{{field.value}}" ng-model="formData[field.value]" placeholder="{{field.name}}" />
<input type="submit" value="Create" />
</form>
</fieldset>
<fieldset>
<legend>All users</legend>
<div ng-controller="ViewUsers">
<input type="text" ng-model="test" />{{test}}
</div>
</fieldset>
</body>
JAVASCRIPT code snippet
/**
* User creation controller.
*
* @param {type} $scope
* @param {type} $http
* @returns {undefined}
*/
function CreateUsers($scope, $http, $rootScope){
// Controller logic here...
}