>

각도 5에서 선택한 드롭 다운 값을 설정하려고합니다.

HTML :

<mat-form-field class="col-sm-3">
   <mat-select placeholder="State" name="state [formControl]="stateFormControl" required>
     <mat-option *ngFor="let state of states" value="{{state.key}}">{{state.name}}
     </mat-option>
   </mat-select>
   <mat-error *ngIf="stateFormControl.hasError('required')">State is required
   </mat-error>
</mat-form-field>

TypeScript :

stateFormControl = new FormControl('', [
    Validators.required
]);
this.vendorForm.controls["state"].setValue(this.state);

FormControl 선언에서 기본값을 설정하더라도 드롭 다운에 대해 기본적으로 아무것도 설정되지 않습니다.

  • 답변 # 1

    이것을 시도해야합니다 :

    this.stateFormControl.setValue(this.state);
    
    

    또는

    <mat-form-field class="col-sm-3">
       <mat-select placeholder="State" name="state" formControlName="state" required>
         <mat-option *ngFor="let state of states" value="{{state.key}}">{{state.name}}
         </mat-option>
       </mat-select>
       <mat-error *ngIf="stateFormControl.hasError('required')">State is required
       </mat-error>
    </mat-form-field>
    
    

    html을 변경하기로 결정한 경우 반응 형 양식에 대한이 자습서를 따르십시오

    그래서 이런 식으로 양식을 작성합니다

    buildForm(){
        this.vendorForm = this.fb.group({
          state: ['', Validators.required ], // <--- You don't need to instantiate FormControls
        });
    }
    
    

    그리고 당신은 다른 곳에서 이것을 가질 것입니다

    <form [formGroup]="vendorForm">
    
    

  • 답변 # 2

    <option> 의 value 속성에 바인딩  태그 :

    <mat-select placeholder="State" name="state [formControl]="stateFormControl" required>
         <mat-option *ngFor="let state of states" [value]="state.key">{{state.name}}
         </mat-option>
    </mat-select>
    
    

관련 자료

  • 이전 파이썬에서 문자열에 정수를 입력 할 때 코드가 다른 것을 출력하는 방법
  • 다음 string - Ruby 스크립트 내부의 Ruby 내부 편집