Within my Angular component, I have declared two boolean variables:
editingPercent: boolean = true;
editingCap: boolean = false;
In the corresponding HTML file, there is a checkbox that updates these variables based on user input:
checkedChanged(e) {
this.editingPercent = !e.value;
console.log(this.editingPercent);
this.editingCap = e.value;
console.log(this.editingCap);
}
Initially, all seems to be working fine as reflected in the console logs.
However, when attempting to use these variables in a custom validation callback elsewhere in the component:
capValidation(e) {
console.log(this.editingCap + ' ' + e.value);
if (this.editingCap && e.value === undefined) {
return false;
}
else { return true; }
}
I encounter an issue where this.editingCap is reported as undefined in the console. Why is this happening?
Any insights would be greatly appreciated.
PS: Once this validation callback hurdle is resolved, it can be simplified to just one line of code.