1

angular2 api Control クラスを見てみると、

minLength(minLength: number) : Function

関数が何をするのか理解しています。

検証が失敗したときに何がうまくいかなかったのかの説明を関数内に配置できないのではないかと思っていました。

たとえば、関数ができないかどうか疑問に思っています

minLength(minLength: number, description: string) : Function

以下に示すように、説明がエラーの理由を説明している場所

Control firstCtrl = new Control( '', Validators.minLength(2, description: 'Minium of two characters required) );

API で同様のバリデーターを見つけることができませんでした。存在する場合は、リンク/説明を共有できれば幸いです.

フィードバックをお待ちしております。

4

1 に答える 1

2

エラーの説明に追加のパラメーターを取る組み込みのバリデーターはありません。しかし、そのためには自分で書くことができます。

組み込みのバリデーターを例にとってみましょうminLength。カスタム エラー メッセージを保持するdescという2 番目のパラメーターを追加します。

class CustomValidators {
  static minLengthWithDescription(minLength: number, desc: string): Function {
    return (control: modelModule.Control): {[key: string]: any} => {
      return v.length < minLength ?
        {"minlength": {
             "requiredLength": minLength, 
             "actualLength": v.length, 
             "desc": desc // Here we pass our custom error message
        }
      } : null;
    };
  }
}

ご覧のとおり、元のものにはほとんど触れていません。エラーメッセージが存在するかどうかをビューで確認するのと同じくらい簡単です

<form [ngFormModel]="myForm">
  <p>
    Year: <input ngControl="year"> 

    // We use the Elvis operator to check if the error exists or not
    // if exists it will print the error message
    {{myForm.controls.year.getError('minlength')?.desc}}
  </p>
</form>

最後に、表示したいエラーメッセージを設定します

export class App {
    year: Control = new Control('', 
        CustomValidators.minLengthWithDescription(4, 'Wrong ammount of numbers'));
}

これは、例が機能するplnkrです。

于 2016-01-29T04:59:17.413 に答える