仅从 Angular 2+ 将特殊字符粘贴到文本框中时修剪特殊字符

Question

而不是利用jQuery或JavaScript在文件类型的组件文件之外的功能ts，需要修剪/删除/限制任何粘贴到文本框后的特殊字符TypeScript只能调用组件内部的函数，粘贴后同样需要反映作为抽象函数的文本框

唯一允许的特殊字符是：

hyphens(-), parenthesis(()), dot(.), underscore(_), numbers(0-9), alphabets(a-zA-Z) and space

---

这是下面显示的完整代码片段                                         

                                                                                              闪电战

HTML

<input type="text" id="bindingId" [(ngModel)]="bindingName"
  (keypress)="validateSpecialCharacters($event)" (paste)="onPaste($event)" 
  onCopy="return false" onDrag="return false" onDrop="return false"/>

组件.ts

public validateSpecialCharacters(e: any): boolean {
    try {
        if (/^[a-zA-Z0-9\-\_\s\(\)\.]*$/.test(e.key)) {
            return true;
        } else {
            e.preventDefault();
            return false;
        }
        // let k;
        // document.all ? k = e.keyCode : k = e.which;
        // k = e.charCode;  // k = event.keyCode;  (Both can be used)
        // return((k > 64 && k < 91) || (k > 96 && k < 123) || k === 8 || k === 32 || k === 40 || k === 41 || k === 45 || k === 46 || k === 95 || (k >= 48 && k <= 57));

    } catch (e) {
    }
}

onPaste(event: ClipboardEvent) {
    let clipboardData = event.clipboardData;
    let pastedText = clipboardData.getData('text');
    let trimmedText = pastedText.replace(/[^a-zA-Z0-9-()._ ]/g, '');
    (<HTMLInputElement>document.getElementById('bindingId')).value = trimmedText;
}

从剪贴板粘贴后，特殊字符的结果仍将保留在文本框中。但不是trimmedText调用的值onPaste()

应修改上述相同的代码，以便每当将任何字符从剪贴板粘贴到文本框时。通过保留唯一允许的特殊字符，其余的需要从文本框中丢弃

我们将如何通过在粘贴到文本框中时仅删除/修剪特殊字符来实现这一点？这应该通过使用jQuery或JavaScript内置函数来完成TypeScript。但不是在TypeScriptie之外，通过从文件<script>或通过.js文件调用任何函数

Answer 1

我通过使用找到了解决方案event.preventDefault();。该方法取消了默认onPaste()方法返回布尔值而不是替换trimmedText值

onPaste(event: ClipboardEvent) {
    let clipboardData = event.clipboardData;
    let regexp = new RegExp('[^-_().;:,!a-zA-Z0-9/ ]');
    let pastedText = clipboardData.getData('text');
    let test = regexp.test(pastedText);
    let trimmedText = pastedText.replace(/[^a-zA-Z0-9-()._ ]/g, '');
    (<HTMLInputElement>document.getElementById('bindingId')).value = trimmedText;
    if (test) {
        event.preventDefault();
    }
}

StackBlitz 演示