I am working on a small AngularJS application with with Material Steppers.
I have to select items from two sections of the page and return true only if the items from both sections belong to the category with id (categoryID) 1.
class Controller {
constructor($mdStepper, validationService) {
this.$mdStepper = $mdStepper;
this.isTriggerA = true;
this.isTriggerB = true;
this.clickedStepNumber = 0;
static get $inject() {
return [
'$mdStepper',
'validationService'
];
}
getCurrentStep() {
this.steppers = this.$mdStepper('stepper');
const steps = this.steppers.steps;
steps.forEach((el, index) => {
let step = this.steppers.steps[index];
if (step.isClicked()) {
this.clickedStepNumber = step.stepNumber;
}
});
}
checkCategory() {
this.getCurrentStep();
if (this.filter.provider) {
let categoryID = parseInt(this.filter.category.id, 10);
console.log('Cid: ' + categoryID);
if (categoryID !== 1) {
this.isTestPassed = false;
} else {
if (parseInt(this.clickedStepNumber, 10) === 1) {
this.isTriggerA = true;
console.log('Step: ' + this.clickedStepNumber);
console.log("A1: " + this.isTriggerA);
console.log("B1: " + this.isTriggerB);
}
if (parseInt(this.clickedStepNumber, 10) === 2) {
this.isTriggerB = true;
console.log('Step: ' + this.clickedStepNumber);
console.log("A2: " + this.isTriggerA);
console.log("B2: " + this.isTriggerB);
}
if (this.isTriggerA === true && this.isTriggerB === true) {
this.isTestPassed = true;
} else {
this.isTestPassed = false;
}
}
}
}
}
I also have this service:
export default class validationService {
constructor() {
this.isTestPassed = true;
}
}
The PROBLEM:
Supose I am in a situation where both my if statements return false. From this point, I make a change in the first block (step) so that it returns true.
The if in the second block does not "remember" the value returned by the if in the first block. It returns to the value at the top of the constructor.
This means that the folowing block of code
if (this.isTriggerA === true && this.isTriggerB === true) {
this.isTestPassed = true;
} else {
this.isTestPassed = false;
}
returns true to early - before this.isTriggerA and this.isTriggerB are both true.
Note: I can not set isTriggerA and isTriggerB to false at the beginning my code, I need to return true if nothing is selected too.
How can I fix this?
from Why does my JavaScript constructor return default property value instead of the modified one?
No comments:
Post a Comment