カスタム検証Angular2

Question

私は

[hidden]="email.valid && email.untouched" 

およびその他を使用したもの以来、カスタム検証を作成したいと思い、私のために十分ではありません。私は別のメッセージを表示したい： 1.電子メールは有効ではありません2.電子メールが必要です。

フォームがロードされると、確認メッセージは表示されません。いいですが、入力中にメッセージの表示/非表示やフィールド外のクリックをしたいときに問題が発生します。私は必要なもの

：タイピング中に

1. 、入力フィールドにフォーカスがあるときに、検証メッセージを表示していけません。
2. 「example @ gmail」と入力してフィールドの外側をクリックすると、電子メールが無効であるという検証メッセージが表示されますが、フィールドを再度クリックして入力を再開すると、入力フィールドをもう一度終了します。私は、フィールドに

を集中するとき、それを隠すために

私は「Gmailの@例」コンテンツを削除し、私はメッセージを表示する「メールが必要とされる」、そして再び私はその多くのことを知っているが、私ができます本当に本当にカスタム検証でヘルプを使います。私は電子メールと有効/元の/触れたパターンを使用したが、私は必要なものを正確に得ることはできません。 Validators.email

According to This you can use "email validator". 

Example: 

If you use template-driven forms: 

<input type="email" name="email" email> 
<input type="email" name="email" email="true"> 
<input type="email" name="email" [email]="true"> 

あなたはモデル駆動型フォーム（別名ReactiveFormsModule）を使用する場合は、使用します：角度4の場合と上記

Answer 1

this.myForm = this.fb.group({ 
    firstName: ['', [<any>Validators.required]], 
    email: ['', [<any>Validators.required, <any>Validators.email]], 
});