I'm relatively new to Angular development. I am currently working on a controller that involves validating user input for registration.
svs.controller('registrationCtrl', function($scope, validatorService) {
$scope.$watch("registrationForm.email.value", function(newValue, oldValue) {
if (validatorService.validateEmail(newValue)) {
$scope.registrationForm.email.valid = true;
} else {
$scope.registrationForm.email.valid = false;
}
});
});
Within the corresponding view, there is an input field where users can enter their email address. The model used by Angular for this input is
$scope.registrationForm.email.value$watch function.
The goal here is to structure an object under $scope.registrationForm with a format resembling this...
{
email: {
value: "<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="2f5c40424a6a424e46436f5d4059464b4a5d014c4042">[email protected]</a>",
valid: true
}
}
The approach involves monitoring changes in the text area value, utilizing a service method for email validation, and updating the valid property of registrationForm.email to true when deemed valid.
However, encountering an error message...
TypeError: Cannot read property 'email' of undefinedI have not explicitly initialized registrationForm.email.valid in the JavaScript code, nor have I referenced it in the HTML markup.
Should I declare this property before assigning a value to it? What could possibly be causing this issue?