AngularJS接受以下内容作为有效的URL:
Django接受这个:
主要的实际差别在于AngularJS接受
由于覆盖Django URL验证器存在问题,我想覆盖AngularJS验证器。我尝试了以下方法,能够成功:
我不太想切换到另一个验证指令,因为我需要更新和检查大量的代码。
有人知道一个可靠的方法吗?
var URL_REGEXP = /^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/;
Django接受这个:
regex = re.compile(
r'^(?:http|ftp)s?://' # http:// or https://
r'(?:(?:[A-Z0-9](?:[A-Z0-9-]{0,61}[A-Z0-9])?\.)+(?:[A-Z]{2,6}\.?|[A-Z0-9-]{2,}\.?)|' #domain...
r'localhost|' #localhost...
r'\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})' # ...or ip
r'(?::\d+)?' # optional port
r'(?:/?|[/?]\S+)$', re.IGNORECASE)
主要的实际差别在于AngularJS接受
http://some-host-without-tld
,而Django只允许http://localhost
作为没有TLD的有效URL。由于覆盖Django URL验证器存在问题,我想覆盖AngularJS验证器。我尝试了以下方法,能够成功:
app.overwriteUrlValidator = function(ngModel) {
// Django RegExp, ported to JS.
var URL_REGEXP = /^(?:http|ftp)s?:\/\/(?:(?:[A-Z0-9](?:[A-Z0-9-]{0,61}[A-Z0-9])?\.)+(?:[A-Z]{2,6}\.?|[A-Z0-9-]{2,}\.?)|localhost|\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3})(?::\d+)?(?:\/?|[\/?]\S+)$/gi;
// Same validator as AngularJS's, only with a different RegExp.
function urlValidator(value) {
if (ngModel.$isEmpty(value) || URL_REGEXP.test(value)) {
ngModel.$setValidity('url', true);
return value;
} else {
ngModel.$setValidity('url', false);
return undefined;
}
}
// This is the part I'm not happy about. I need to use a timeout
// because my code is executed before Angular adds its URL validator.
// If I add mine before Angular does, it will not work for ??? reason.
window.setTimeout(function() {
ngModel.$formatters.push(urlValidator);
ngModel.$parsers.push(urlValidator);
}, 100);
};
/**
* Keep track of user's interaction with input fields
*/
app.inputDirective = function() {
function link(scope, element, attrs, ngModel) {
if (ngModel && attrs.type === 'url') {
app.overwriteUrlValidator(ngModel);
}
}
return {
restrict: 'A',
require : '?ngModel',
link : link
};
};
app.directive('input', app.inputDirective);
app.directive('textarea', app.inputDirective);
我不太想切换到另一个验证指令,因为我需要更新和检查大量的代码。
有人知道一个可靠的方法吗?
require : ['?ngModel']
,链接函数的ngModel参数将被填充为一个数组,在ngModel.$parsers.unshift
失败。使用require : '?ngModel'
就可以了。 - Vicente Gallur Valerorequire: ['?ngModel']
= 参数使用ngModel[0]
,而require: '?ngModel'
= 参数使用ngModel
。要求的数组格式是为了在指令中要求多个控制器。我更新了我的答案,因为确实存在不匹配。 - Blaise