@@ -1455,7 +1455,7 @@ For more info on the topic, you can take a look at this
14551455## Migrating from 1.3 to 1.4
14561456
14571457AngularJS 1.4 fixes major animation issues and introduces a new API for `ngCookies`. Further, there
1458- are changes to `ngMessages`, `$compile`, `ngRepeat`, `ngOptions ` and some fixes to core filters:
1458+ are changes to `ngMessages`, `$compile`, `ngRepeat`, `ngOptions`, `ngPattern`, `pattern` and some fixes to core filters:
14591459`limitTo` and `filter`.
14601460
14611461The reason for the ngAnimate refactor was to fix timing issues and to expose new APIs to allow
@@ -1469,9 +1469,9 @@ to render error messages with ngMessages that are listed with a directive such a
14691469involves pulling error message data from a server and then displaying that data via the mechanics of ngMessages. Be
14701470sure to read the breaking change involved with `ngMessagesInclude` to upgrade your template code.
14711471
1472- Other changes, such as the ordering of elements with ngRepeat and ngOptions, may also affect the behavior of your
1473- application. And be sure to also read up on the changes to `$cookies`. The migration jump from 1.3 to 1.4 should be
1474- relatively straightforward otherwise.
1472+ Other changes, such as the ordering of elements with ngRepeat and ngOptions and the way ngPattern and pattern directives
1473+ validate the regex, may also affect the behavior of your application. And be sure to also read up on the changes to `$cookies`.
1474+ The migration jump from 1.3 to 1.4 should be relatively straightforward otherwise.
14751475
14761476
14771477
@@ -1575,7 +1575,7 @@ class based animations (animations triggered via ngClass) in order to ensure tha
15751575
15761576
15771577
1578- ### Forms (`ngMessages`, `ngOptions`, `select`)
1578+ ### Forms (`ngMessages`, `ngOptions`, `select`, `ngPattern` and `pattern` )
15791579
15801580#### ngMessages
15811581The ngMessages module has also been subject to an internal refactor to allow it to be more flexible
@@ -1683,6 +1683,79 @@ ngModelCtrl.$formatters.push(function(value) {
16831683});
16841684```
16851685
1686+ #### ngPattern and pattern
1687+
1688+ Due to [0e001084](https://github.com/angular/angular.js/commit/0e001084ffff8674efad289d37cb16cc4e46b50a),
1689+ The `ngPattern` and `pattern` directives will validate the regex
1690+ against the `$viewValue` of `ngModel`, i.e. the value of the model
1691+ before the $parsers are applied. Previously, the `$modelValue`
1692+ (the result of the $parsers) was validated.
1693+
1694+ This fixes issues where `input[date]` and `input[number]` cannot
1695+ be validated because the `$viewValue` string is parsed into
1696+ `Date` and `Number` respectively (starting with Angular 1.3).
1697+ It also brings the directives in line with HTML5 constraint
1698+ validation, which validates against the input value.
1699+
1700+ This change is unlikely to cause applications to fail, because even
1701+ in Angular 1.2, the value that was validated by pattern could have
1702+ been manipulated by the $parsers, as all validation was done
1703+ inside this pipeline.
1704+
1705+ If you rely on the pattern being validated against the `$modelValue`,
1706+ you must create your own validator directive that overwrites
1707+ the built-in pattern validator:
1708+
1709+ ```
1710+ .directive('patternModelOverwrite', function patternModelOverwriteDirective() {
1711+ return {
1712+ restrict: 'A',
1713+ require: '?ngModel',
1714+ priority: 1,
1715+ compile: function() {
1716+ var regexp, patternExp;
1717+
1718+ return {
1719+ pre: function(scope, elm, attr, ctrl) {
1720+ if (!ctrl) return;
1721+
1722+ attr.$observe('pattern', function(regex) {
1723+ /**
1724+ * The built-in directive will call our overwritten validator
1725+ * (see below). We just need to update the regex.
1726+ * The preLink fn guaranetees our observer is called first.
1727+ */
1728+ if (isString(regex) && regex.length > 0) {
1729+ regex = new RegExp('^' + regex + '$');
1730+ }
1731+
1732+ if (regex && !regex.test) {
1733+ //The built-in validator will throw at this point
1734+ return;
1735+ }
1736+
1737+ regexp = regex || undefined;
1738+ });
1739+
1740+ },
1741+ post: function(scope, elm, attr, ctrl) {
1742+ if (!ctrl) return;
1743+
1744+ regexp, patternExp = attr.ngPattern || attr.pattern;
1745+
1746+ //The postLink fn guarantees we overwrite the built-in pattern validator
1747+ ctrl.$validators.pattern = function(value) {
1748+ return ctrl.$isEmpty(value) ||
1749+ isUndefined(regexp) ||
1750+ regexp.test(value);
1751+ };
1752+ }
1753+ };
1754+ }
1755+ };
1756+ });
1757+ ```
1758+
16861759
16871760### form
16881761
0 commit comments