アングル2リアボフォームのカスタムバリデータ

Question

テンプレート駆動フォームをまったく使用していない場合は、Reactiveフォームのカスタムバリデータを実装する適切な方法を教えてください。私は

https://blog.thoughtram.io/angular/2016/03/14/custom-validators-in-angular-2.html

と

https://angular.io/docs/ts/latest/cookbook/form-validation.html#!#custom-validation

を通じて両端に行っている

ディレクティブを作成し、それが必要なのか？それともディレクティブを作成せずにそれを行うことができますか？

が、私はこの試みた：

//my-app.module.ts 
export interface ValidationResult { 
    [key: string]: boolean; 
} 

function personName(control: FormControl): ValidationResult { 

     if (!control.value) { 
      return null; 
     } 

     var valid = /^[a-zA-Z. ]*$/.test(control.value); 

     if (valid) { 
      return null; 
     } 
     return { "pattern": true }; 
    } 


@NgModule({ 
    imports: [ 
     CommonModule, 
     ReactiveFormsModule 
    ], 
    declarations: [ 
     MyComponent 
    ], 
    exports: [ 
    ], 
    providers: [{ provide: NG_VALIDATORS, useExisting: personName, multi: true }] 
}) 
export class MyModule { } 

をしかし、私は、ブラウザで私の反応型にPERSONNAMEバリデータを適用し、それをテストするとき、私は、コンソールにエラーの下に取得する：

ERROR Error: Uncaught (in promise): Error: No provider for personName! 

Answer 1

反応性のフォームを使用して、バリデーターをprovideする必要はありません。代わりに、コンポーネントにフォームを作成するときにオブジェクトをformControlオブジェクトに添付します。フォームビルダを使用すると、次のようになります。

ngOnInit() { 
    this.myform = this.formBuilder.group({ 
    name: [undefined, personName], 
    }) 
}