Angular 当控件失去焦点时如何显示模式验证错误-角度2

我使用FormBuilder方法制作了一个表单。现在我想添加一些模式验证

我添加了验证，效果很好。但验证错误在非预期时间显示

我添加了一个

textfield

，并添加了一个

模式

验证。我想在另一个控件被选中或失去焦点时显示错误消息。 但目前，只要我开始输入文本，验证错误就会显示出来

我可以在失去焦点事件中显示错误消息吗。我知道我可以通过在

TextControl

的

onChange

事件中绑定一个方法来轻松实现这一点，但如果有其他方法，我很想知道

---

是的，您可以在特定的一个控件上订阅值更改控件值更改

例如 **

第一种方法

第二种方法

html

---

是的，我知道这个方法。我对模糊事件感兴趣。当控件失去焦点@shalesh时，如何显示错误消息您的代码工作正常。我可以像在Plunker中那样只使用类来做同样的事情吗。

 import...
    @Component({..})
    export class ExampleComponent implements OnInit {

         ngOnInit(): void {
                this.formName.get('name')
                    .valueChanges
                    .filter((value: string) => value != null && value.length > 0) // use filter if needed otherwise remove it
                    .subscribe((value: string) => {
                         if (!value.match(/[-!$%^&*(/]/... set here your pettern)) {
                                  this.formName.controls.name.setErrors({});
                             }
                    }

            }
        }

<input type='text' (blur)="checkValidation()" formControlName="name">

import...
    @Component({..})
    export class ExampleComponent implements OnInit {
    errorMessage ='';
         ngOnInit(): void {

            }

      checkValidation(): void {
            if (!value.match(/[-!$%^&*(/]/... set here your pettern)) {
                this.formName.controls.name.setErrors({});
                 this.errorMessage = 'set here your message';
              }
        }