Angular UI Mask Validation

Question

Im using AngularUI Utils in attempt to mask a date input. However, when I try to test a regex against the field to validate the date format, it returns false every time.

HTML

<div class="row form-group">
  <div class="col-xs-12">
    <label>Date of Birth</label>
    <input class="form-control" ng-model="vm.dateOfBirth" ui-mask="99/99/9999" placeholder="MM/DD/YYYY" />
  </div>
</div>

AngularJS

var dateRegex = /^\d{2}\/\d{2}\/\d{4}$/;

var vm = this;
vm.dateOfBirth = "";

vm.validateInput = function () {
    return dateRegex.test(vm.dateOfBirth);
}

Is there any other way to validate this input?

Answer 1

I found a solution, but seems a bit hacky. Apparently if the model does not match the mask regex, the variable will be undefined or an empty string (when you backspace through the mask).

vm.validateInput = function () {
    return typeof vm.dateOfBirth !== "undefined" && vm.dateOfBirth != "";
}

This seems to do the trick, but it will only work for the very simple regular expressions that are accepted by AnguarUI masks. I would love to know if there is another way to apply additional regex validation on top of the mask like I was attempting to do originally.