angularjs – $parsers不使用space
发布时间:2020-12-17 07:19:46 所属栏目:安全 来源:网络整理
导读:我有一个服装指令来设置%的东西,例如: – 快乐:[90] – 悲伤:[10] 所以它只允许1到100.所以我不想允许任何字符等.我知道我可以使用ng-pattern等..但我不希望他们甚至添加一个字符所以我必须这样做. 它的工作原理,但我遇到的问题是空间不会触发$解析器,是
|
我有一个服装指令来设置%的东西,例如:
– 快乐:[90] – 悲伤:[10] 所以它只允许1到100.所以我不想允许任何字符等.我知道我可以使用ng-pattern等..但我不希望他们甚至添加一个字符所以我必须这样做. 它的工作原理,但我遇到的问题是空间不会触发$解析器,是否有一个解决方法用于触发空间? app.directive('numericOnly',function(){
return {
require: 'ngModel',link: function(scope,element,attrs,modelCtrl) {
modelCtrl.$parsers.push(function (inputValue) {
//Remove all non numeric values
var transformedInput = inputValue.replace(/D/g,'');
//Remove all spaces
transformedInput = transformedInput.replace(/s/g,"");
//Remove any leading zero
if(transformedInput.substring(0,1) === '0') {
console.log('is zero');
if(transformedInput.length === 1) {
transformedInput = '';
} else {
transformedInput = transformedInput.substring(1,transformedInput.length);
}
}
//Make sure it is not over 100
var numberCopy = parseInt(transformedInput);
if(!isNaN(numberCopy)){
if(numberCopy > 100) {
console.log('bigger than 100');
numberCopy = 100;
transformedInput = String(numberCopy);
}
}
//If changes done,then update modelCtrl
if (transformedInput!=inputValue) {
modelCtrl.$setViewValue(transformedInput);
modelCtrl.$render();
}
//Return
return transformedInput;
});
}
};
});
Plunker:http://plnkr.co/edit/oKXExZ8lkHzUSqHKpm1n?p=preview
默认情况下,Angular会修剪ngModel值.因此,您需要将
ng-trim指令添加到输入元素,它不允许字符串两侧的空格.
<input type="text" numeric-only="" ng-trim="false" ng-model="nyNumber"/> 而且你不再需要这条线了 //Remove all spaces transformedInput = transformedInput.replace(/s/g,""); (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |
