After my code was initially running smoothly, I decided to add some new functions for login which unfortunately caused it to break. Even after removing the added code, the error message "create function of the user service is not a function" persists. Despite scouring through various sources for solutions, none of the suggested answers seem to resolve the issue.
UserController
todoApp.controller('UserController', ['Users','$scope', function UserController(Users, $scope) {
console.log("in user controller");
$scope.formModel = {};
$scope.submitting = false;
$scope.submitted = false;
$scope.has_error = false;
console.log($scope.formModel);
$scope.createUser = function() {
if(!$scope.registerForm.$valid) {
return;
}
Users.create($scope.formModel)
.success(function(data){
$scope.submitting = false;
$scope.submitted = true;
$scope.has_error = false;
$scope.formModel = {}; // clear the form so our user is ready to enter another
$scope.users.push(data);
console.log(":)");
}).error(function(data) {
console.log(":(");
$scope.submitting = false;
$scope.submitted = false;
$scope.has_error = true;
});
};
}]);
user.sevice.js
todoApp.factory('Users', ['$http', function($http) {
return {
get: function() {
return $http.get('/api/users');
},
create: function(userData) {
console.log(userData);
return $http.post('/api/users', userData);
},
delete: function(id) {
return $http.delete('/api/users/' + id);
},
update: function(userData) {
return $http.put('/api/users/' + userData.id, userData);
console.log(userData);
}
}
}]);
register.html
<div class="container">
<div class="row main" ng-controller="UserController">
<div class="main-login main-center">
<h5>Sign up once for instant access.</h5>
<form name="registerForm" ng-submit="createUser()"
novalidate="novalidate"
ng-hide="submitted" >
<div class="form-group">
<label for="name" class="cols-sm-2 control-label">Your Name</label>
<div class="cols-sm-10">
<div class="input-group">
<span class="input-group-addon"><i class="fa fa-user fa" aria-hidden="true"></i></span>
<input type="text"
class="form-control"
ng-model="formModel.name"
id="name"
placeholder="Enter your Name"
required="required" />
</div>
</div>
</div>
... (Remaining HTML code omitted for brevity)
</form>
</div>
</div>
</div>