I have been using Regex pattern validation with AngularJS for the last several versions and it has worked fine.
My application requires that validation patterns are exposed by a scope property, to which the corresponding AngularJS validation directive is bound. Prior to v1.3, it looked something like this:
// On the controller
$scope.validationPattern = "^\\d*$"; // Allow only numeric digits
<!-- in the HTML page --->
<input type="text" name="age" ng-pattern="/{{validationPattern}}/" />
Having now updated AngularJS to v1.4 (bypassing v1.3), I find that the above approach no longer works. Looking at the migration notes for v1.3, I see that this is expected behavior and that a new approach is required, which looks something like this:
// On the controller
$scope.validationRegexp = /^\d*$/; // Use a RegExp instead of a string
<!-- in the HTML page --->
<input type="text" name="age" pattern="{{validationRegexp}}" />
However, I simply can't get this to work. If I place the validation pattern inline (within the HTML input element) it works fine, but when moved onto the scope object and bound to the pattern
or ng-pattern
directive, no validation occurs.
Here's a JSFiddle that demonstrates the problem.
Any suggestions please?