37

ReactiveFormsモジュールを使用してカスタムバリデーターを使用するフォームを管理するAngular 2 アプリケーションがあります。バリデータはFormControlオブジェクトを受け取ります。FormControlバリデーターに渡されたときにフィールドの名前を知っていれば、同じカスタムバリデーターを使用できるいくつかの入力フィールドがあります。

FormControl入力フィールドの名前を公開するメソッドまたはパブリック プロパティが見つかりません。もちろん、その値を確認するのは簡単です。以下は、私がそれをどのように使用したいかを示しています。

public asyncValidator(control: FormControl): {[key: string]: any} {
  var theFieldName = control.someMethodOfGettingTheName(); // this is the missing piece

  return new Promise(resolve => {
      this.myService.getValidation(theFieldName, control.value)
        .subscribe(
          data => {
            console.log('Validation success:', data);
            resolve(null);
          },
          err => {
            console.log('Validation failure:', err);
            resolve(err._body);
          });
    });
  }
4

7 に答える 7

25

.parent今日、プロパティを使用できます["_parent"] （詳細は以下を参照）：

export const getControlName = (control: ng.forms.AbstractControl) =>
{
    var controlName = null;
    var parent = control["_parent"];

    // only such parent, which is FormGroup, has a dictionary 
    // with control-names as a key and a form-control as a value
    if (parent instanceof ng.forms.FormGroup)
    {
        // now we will iterate those keys (i.e. names of controls)
        Object.keys(parent.controls).forEach((name) =>
        {
            // and compare the passed control and 
            // a child control of a parent - with provided name (we iterate them all)
            if (control === parent.controls[name])
            {
                // both are same: control passed to Validator
                //  and this child - are the same references
                controlName = name;
            }
        });
    }
    // we either found a name or simply return null
    return controlName;
}

これで、バリデーターの定義を調整する準備が整いました

public asyncValidator(control: FormControl): {[key: string]: any} {
  //var theFieldName = control.someMethodOfGettingTheName(); // this is the missing piece
  var theFieldName = getControlName(control); 
  ...

.parent後で、["_parent"]今

現時点（今日、現在）、現在のリリースは次のとおりです。

2.1.2 (2016-10-27)

しかし、この問題に従ってください: feat(forms): make 'parent' a public property of 'AbstractControl'

そして、すでにここで述べたように

2.2.0-beta.0 (2016-10-20)

特徴

  • フォーム: 「親」を「AbstractControl」のパブリック プロパティにする (#11855) (445e592)
  • ...

を後で変更でき["_parent"]ます.parent

于 2016-11-02T14:44:09.273 に答える
4

次の 2 つのオプションがあります。

Attributeデコレータの助けを借りて：

constructor(@Attribute('formControlName') public formControlName) {}

Inputデコレータの助けを借りて：

@Input() formControlName;

これを使用するには、検証はもちろんディレクティブである必要があります。

于 2016-11-01T15:15:55.583 に答える