Why is my custom validation in Angular2 not working

Question

Here are two angular2 custom validations that I wrote, the first one validateAge works, but the second one validateDob does not ... the difference is the validateAge uses the component that I am on and is a text based field, the second one needs to use a Date Entry field and find the difference between today's date and the birthdate to find the actual age and then measure it against the age field. but something is not right ... any ideas

function validateAge(control: FormControl): { [s: string]: boolean } {
  if (parseInt(control.value) <= 0) {
    return {invalidAge: true};
  }
}

function validateDob(control: FormControl): {[s:string]: boolean}{
  var today = new Date();
  var calcAge = today - control.value;
  if (calcAge != parseInt([{age}]) ){
    return {invalidDate: true}
  }
}

Try using Math.floor(calcAge) in your comparison statement. — Feathercrown
– Feathercrown, Commented Oct 11, 2016 at 12:08
sorry, control.value is an entered birthdate ... like 03/01/1978 it is <input type="date"> — Paul T. Rykiel
– Paul T. Rykiel, Commented Oct 11, 2016 at 12:30

silentsod · Accepted Answer · 2016-10-11 15:59:22Z

1

The issue you have here is that your control.value is not a Date object, but rather the string representation.

var today = new Date();

Difference in milliseconds between the current timestamp and the entered value

var diff = today - new Date(control.value);

divide by ms per year and take the floor

var calcAge = Math.floor(diff/ (1000*60*60*24*365)));

Now do whatever comparison you need against the appropriate value. You didn't show us what your age object is so I don't actually know what comparison you're looking for.

if (calcAge < someAgeThreshold) ){
    return {invalidDate: true}
} else {
    return null;
}

Also note that with custom validation the validator returns no error when you return null and anything with a value is considered to have an error.

answered Oct 11, 2016 at 15:59

silentsod

8,35545 silver badges41 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

silentsod Over a year ago

You're welcome. If that answer helped you to get a complete and functional validator would you mind marking it as the accepted answer?

Paul T. Rykiel Over a year ago

one more quick question ... in validateDob routine ... I am having issue getting the value of an input field ... age. My colleague tells me to use @viewchild you have any experience with this.

silentsod Over a year ago

That depends on how you're doing the inputs and what patterns you're establishing in house. If it's in a separate component and you need access you can use the @ViewChild('alias')myComponent: MyComponent decorator or have it as an output from the component or access it directly. It might be worthwhile to open up a separate question or review the Angular docs here angular.io/docs/ts/latest/cookbook/component-communication.html which has a rundown of the various methods. The scope is a little bit too much for just the comments section.

Paul T. Rykiel Over a year ago

I actually figured out how to do this. I am updating my "input" to my custom validation " with my FormGroup" ... and once I did that, I was able to use the "get('xxxx').value" to get my form values. So, thank you so much!!

Collectives™ on Stack Overflow

Why is my custom validation in Angular2 not working

1 Answer 1

4 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Related