「「formControlAnimalSelect」のプロパティ「validator」に割り当てることができません:オブジェクトではありません」Angular Typescript

ヴェロネーゼComS

選択を入力せずにバリデーターを適用しようとしていますが、

「「formControlAnimalSelect」のプロパティ「validator」に割り当てることができません:オブジェクトではありません」

私は試してみます:

TS:

  formControlAnimalSelect = new FormControl('valid', [
      Validators.required,
      Validators.pattern('valid'),
    ])

ngOnInit() {
      this.secondFormGroup = this._formBuilder.group({
        formControlAnimalSelect:['',Validators.required]
      });

HTML:

<form [formGroup]="secondFormGroup">
<div class="formSegundoGrupo">
                <mat-form-field>
                  <mat-select name="selectAnimals" formControl="formControlAnimalSelect" placeholder="Eu perdi um...">
                    <mat-option value="gato">
                      Gato
                    </mat-option>
                    <mat-option value="cahorro">
                      Cachorro
                    </mat-option>
                    <mat-option value="coelho">
                      Coelho
                    </mat-option>
                    <mat-option value="tartaruga">
                      Tartaruga
                    </mat-option>
                  </mat-select>

                  <mat-error *ngIf="selectAnimal.hasError('required')">Você precisa selecionar ao menos um pet!</mat-error>

                </mat-form-field>
              </div>

             </form>
スニル・シン

問題は、1つのことを2つの異なる方法で実装したことです。

ケース1:コントロールのみを使用する場合

ts

  formControlAnimalSelect = new FormControl('valid', [
      Validators.required,
      Validators.pattern('valid'),
    ])

ngOnInit() {
      /* Remove this code
      this.secondFormGroup = this._formBuilder.group({
        formControlAnimalSelect:['',Validators.required]
      });*/
  }

html

<mat-select name="selectAnimals" 
 [formControl]="formControlAnimalSelect" placeholder="Eu perdi um...">

ケース2:フォームと一緒にコントロールを使用する場合

ts

 /* remove this code
 formControlAnimalSelect = new FormControl('valid', [
      Validators.required,
      Validators.pattern('valid'),
    ])
 */

ngOnInit() {
      this.secondFormGroup = this._formBuilder.group({
        formControlAnimalSelect:['',Validators.required]
      });

html

<mat-select name="selectAnimals" 
 formControlName="formControlAnimalSelect" placeholder="Eu perdi um...">

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

Related 関連記事

ホットタグ

アーカイブ