NG_VALIDATORSとバリデーター（クラス）の違い

Question

NG_VALIDATORSの使い方が混乱しています。私はそれがプロバイダートークンであることを知っています。しかし、その使用は何ですか？それはどのようなフォームバリデータクラスでもどうですか？

https://github.com/angular/angular/blob/4.3.3/packages/forms/src/validators.ts

Answer 1

フォームコントロールにバリデータを追加するには2つの方法があります。フォームコントロールにパラメータとしてそれらを指定することによって、不可欠なアプローチを使用して：宣言

const ctrl = new FormControl('', Validators.required); 

またはテンプレートにバリ特定のディレクティブを使用して：

<input [formControl]='ctrl' required> 

NG_VALIDATORSトークンが第二の場合に使用されます。これらのトークンは、バリデータディレクティブrequired,emailなどによって定義されます。そして、フォームディレクティブによって作成されたインジェクタ - NgForm、NgModelおよびNgModelGroupで定義されています。独自のインジェクタを作成するディレクティブの詳細については、How exactly works the services hierarchy in this Angular 2 application?を参照してください。

export const EMAIL_VALIDATOR: any = { 
    provide: NG_VALIDATORS, 
    useExisting: forwardRef(() => EmailValidator), 
    multi: true 
}; 
@Directive({ 
    selector: '[email]...', 
    providers: [EMAIL_VALIDATOR] <------------- 
}) 
export class EmailValidator implements Validator { 

---

export const REQUIRED_VALIDATOR: Provider = { 
    provide: NG_VALIDATORS, 
    useExisting: forwardRef(() => RequiredValidator), 
    multi: true 
}; 
@Directive({ 
    selector: 
     '[required]...', 
    providers: [REQUIRED_VALIDATOR], <------------- 
}) 
export class RequiredValidator implements Validator { 

---

角度に反応し、テンプレート駆動型フォームディレクティブ（NgForm、NgModelとNgModelGroup）を使用してバリデータを挿入：

すべてのビルトインとカスタムバリデータはこのトークンを使用して登録されていますこのトークン：

---

export class NgModelGroup extends AbstractFormGroupDirective implements ... { 
    ... 
    constructor(
     @Optional() @Self() @Inject(NG_VALIDATORS) validators: any[], 

同じ

---

は NG_ASYNC_VALIDATORSトークンのために行きます。