Question

我想在控制器中使用模式进行模板验证

angular.module('app', []).controller('ctrl', function ($scope) {
  $scope.pat = /(\(|\)|\+|\d)+/g;
})

但输入值为123--

时，ng-pattern验证字段

<input type="text" ng-pattern="pat" name='asd' ng-model='asd'>

但内联模式属性工作正常并注意到123--无效

<input type="text" pattern="(\(|\)|\+|\d)+" name='asd' ng-model='asd2'>

我做错了什么？

Answer 1

更改您的控制器以使文字字符串而不是正则表达式，并且行为将与将模式直接放在ng-pattern属性

中的行为相同

angular.module('app', []).controller('ctrl', function ($scope) {
  $scope.pat = '(\\(|\\)|\\+|\\d)+';
});

更改html以使用pat表达式。

<input type="text" ng-pattern="{{pat}}" name='asd' ng-model='asd'>

Plunker #1

当值作为字符串传递时，显然是ng-pattern使得整个字符串从头到尾匹配。所以它就好像正则表达式包含^$个锚点。

这是来自angular.js / validators.js的源代码。它显示正则表达式转换为正则表达式，如果它是一个字符串。

if (isString(regex) && regex.length > 0) {
   regex = new RegExp('^' + regex + '$');
}

因此，另一种解决方案是保持html标记相同并更改控制器，以便正则表达式通过使用锚点匹配整个字符串。如果你把全局标志放在表达式中，那么你会得到一些不稳定的行为。

angular.module('app', []).controller('ctrl', function ($scope) {
  $scope.pat = /^(\(|\)|\+|\d)+$/;
});

Plunker #2