Regex 带有ng模式的Angularjs ui掩码
下面的代码不起作用Regex 带有ng模式的Angularjs ui掩码,regex,angularjs,ng-pattern,angularjs-ui-utils,Regex,Angularjs,Ng Pattern,Angularjs Ui Utils,下面的代码不起作用 <input type="text" class="form-control input-sm" placeholder="hh:mm:ss" name="hhmmss" ng-model="data.hhmmss" ui-mask="99:99:99" ng-pattern="/^([0-2]|0[0-9]|1[0-9]|2[0-3]):?[0-5][0-9]:?[0-5][0-9]$
<input type="text"
class="form-control input-sm"
placeholder="hh:mm:ss"
name="hhmmss"
ng-model="data.hhmmss"
ui-mask="99:99:99"
ng-pattern="/^([0-2]|0[0-9]|1[0-9]|2[0-3]):?[0-5][0-9]:?[0-5][0-9]$/"
/>
当输入值为20:00:00
时,则formName.hhmmss.$error.pattern
为false
如何在
ng模式中使用regex?我也遇到了同样的问题,修改了mask.js文件以更新keypress上的范围值。有一行代码可以执行此操作,但不是一直运行
controller.$setViewValue(valUnmasked);
将if语句更新为以下内容:
if (valAltered || iAttrs.ngPattern) {
这将在按键上运行“scope.apply”并更新模型。Angular 1.3.19更改了打破ui掩码的ng模式的行为
目前,ng模式指令验证的是$viewValue
,而不是$modelValue
-
Angular团队提供了恢复以前行为的自定义指令。这是解决这个问题的好办法
当您同时使用ui-mask
和ng-pattern
时,必须向字段添加pattern-model
属性
<input type="text"
class="form-control input-sm"
placeholder="hh:mm:ss"
name="hhmmss"
ng-model="data.hhmmss"
ng-pattern="/^([0-2]|0[0-9]|1[0-9]|2[0-3]):?[0-5][0-9]:?[0-5][0-9]$/"
ui-mask="99:99:99"
pattern-model
/>
ui mask GitHub-中的问题。从ng模式中删除^。
<input type="text"
class="form-control input-sm"
placeholder="hh:mm:ss"
name="hhmmss"
ng-model="data.hhmmss"
ng-pattern="/^([0-2]|0[0-9]|1[0-9]|2[0-3]):?[0-5][0-9]:?[0-5][0-9]$/"
ui-mask="99:99:99"
pattern-model
/>
.directive('patternModel', function patternModelOverwriteDirective() {
return {
restrict: 'A',
require: '?ngModel',
priority: 1,
compile: function() {
var regexp, patternExp;
return {
pre: function(scope, elm, attr, ctrl) {
if (!ctrl) return;
attr.$observe('pattern', function(regex) {
/**
* The built-in directive will call our overwritten validator
* (see below). We just need to update the regex.
* The preLink fn guarantees our observer is called first.
*/
if (angular.isString(regex) && regex.length > 0) {
regex = new RegExp('^' + regex + '$');
}
if (regex && !regex.test) {
//The built-in validator will throw at this point
return;
}
regexp = regex || undefined;
});
},
post: function(scope, elm, attr, ctrl) {
if (!ctrl) return;
regexp, patternExp = attr.ngPattern || attr.pattern;
//The postLink fn guarantees we overwrite the built-in pattern validator
ctrl.$validators.pattern = function(value) {
return ctrl.$isEmpty(value) ||
angular.isUndefined(regexp) ||
regexp.test(value);
};
}
};
}
};
});