我想加密(使用任何算法)ngModel
的值。只应加密$modelValue
,并且视图值应为纯文本。
为此,我提出了一个小的自定义指令: -
angular.module('utilityModule').directive('encrypt', function() {
var aesUtil = new AesUtil(128, 10);
return {
restrict: 'A',
require: 'ngModel',
replace: false,
compile: function(tElem, tAttrs) {
var modelName = tAttrs['ngModel'];
var pattern = tAttrs['ngPattern']; // to check if there is ngPattern directive used.
return {
pre: function(scope, element, attrs, fn) {
// to avoid encrypting on every key press.
fn.$options = {
updateOn: 'blur'
};
fn.$parsers.push(function(value) {
//encrypt
console.log('parser invoked');
return value ? aesUtil.encrypt(modelName, modelName, modelName, value) : value;
});
fn.$formatters.push(function(value) {
//decrypt
console.log('formatter invoked');
return value ? aesUtil.decrypt(modelName, modelName, modelName, value) : value;
});
fn.$validators.pattern = function(){
// trying to overrule ngPattern directive. DOESN'T HELP!!
return true;
};
// Just for playing around
fn.$validators.amyValid = function(modelValue, viewValue) {
console.log('Custom validator invoked. modelValue=' + modelValue + ' and viewValue=' + viewValue);
return true;
};
},
post: function(scope, element, attrs, fn) {}
};
}
};
});
该指令有效,除非我们将ngPattern与ngModel指令一起使用。例如: -
<div class="table-responsive" ng-form="testForm">
<input name="test" type="text" ng-model="test" encrypt ng-pattern="/^[0-9]+$/"/>
<br>
{{test}}
</div>
ngPattern
指令应使用$viewValue
代替$modelValue
进行验证。
如何覆盖&#39; patternDirective
&#39;指令出现在核心angular.js
?
或任何其他建议......
刚才意识到不只是ngPattern
,所有其他验证(maxLength,minLength,max,min)都只应用于视图值
我的调试器显示传递给patternDirective验证器的值是加密验证器。请参阅随附的屏幕截图。
升级到angularjs 1.4.5解决了这个问题。我相信1.3.x对模型值进行了验证,而不是查看值。
答案 0 :(得分:2)
升级到angularjs 1.4.5解决了这个问题。我相信1.3.x对模型值进行了验证,而不是查看值。