angular
.module('app')
.directive('restrictField', function () {
return {
restrict: 'AE',
scope: {
restrictField: '='
},
link: function (scope) {
// this will match spaces, tabs, line feeds etc
// you can change this regex as you want
var regex = /\s/g;
scope.$watch('restrictField', function (newValue, oldValue) {
if (newValue != oldValue && regex.test(newValue)) {
scope.restrictField = newValue.replace(regex, '');
}
});
}
};
});
import {Directive, ElementRef, HostListener} from '@angular/core';
@Directive({
selector: '[appInputTrim]'
})
/**
* This directive is used to trim the input value.
* @author Hakkı Konu
*/
export class InputTrimDirective {
constructor(private el: ElementRef) {
}
@HostListener('input', ['$event.target.value'])
trim(value: string) {
this.el.nativeElement.value = value.trim();
console.log('value', value);
}
}
9条答案
按热度按时间fkaflof61#
选择的答案可以说不是很unobtrusive。如果你需要在多个地方使用它,你最终会得到重复的代码。
我更喜欢使用以下指令来防止输入空格。
这个指令可以这样调用:
vc9ivgsu2#
更新:为了提高代码质量,您可以创建自定义指令。但是不要忘记,你的指令不仅要防止键盘输入,还要防止粘贴。
这里添加ng-trim=“false”属性来禁用输入的修剪是很重要的。
yzxexxkh3#
如果你想实现它,而不写指令,
ng-keydown="$event.keyCode != 32 ? $event:$event.preventDefault()"
disho6za4#
杰森写的指令对我不起作用。我不得不将return false改为:e.preventDefault()如下所示:
t5zmwmid5#
这可以防止输入任何特殊字符,包括空格:
hec6srdp6#
不使用jquery
yiytaume7#
您可以在不编写指令的情况下实现这一点。
vd2z7a6w8#
Angular 9不支持Keycode。
下面的代码可以帮助你。
public void run(){
dauxcl2d9#
您可以为此定义一个指令。使用Angular v16测试
使用