각도 검사기가 작동하지 않습니다.

Question

자습서에 따라 각도 검사기를 양식에 삽입하려고했지만 유효성 검사가 무시됩니다.

보기

<div class="form-group row"> 
    <label for="inputLocalita" class="col-sm-2 col-form-label col-form-label-sm">Località</label> 
    <label *ngIf="!edit" class="col-sm-10 col-form-label col-form-label-sm grey" id="inputLocalita">{{immobile.localita}}</label> 
    <div *ngIf="edit" class="col-sm-10"> 
    <input type="text" class="form-control form-control-sm" id="inputLocalita" formControlName="localita" placeholder="Località"> 
    </div> 
    <div *ngIf="imm.controls.localita.errors && (imm.controls.localita.dirty || imm.controls.localita.touched)"> 
    <p *ngIf="imm.controls.localita.errors.required">Field is required</p> 
    <p *ngIf="imm.controls.localita.errors.minlength">Field must be 8 characters long</p> 
    </div> 
</div> 

컨트롤러

ngOnInit() { 

    this.imm = new FormGroup({ 
     comune: new FormControl(), 
     provincia: new FormControl(), 
     comuneObj: new FormControl(), 
     cap: new FormControl(), 
     indirizzo: new FormControl(), 
     civico: new FormControl(), 
     localita: new FormControl([ 
     Validators.minLength(4), 
     Validators.required]), 
     destinazioneUso: new FormControl(), 
     destinazioneUsoAltro: new FormControl(), 
     destinazioneUsoPrincipale: new FormControl(), 
     destinazioneUsoSecondaria: new FormControl(), 

    }); 

나는 실종 뭔가 : 여기 내 코드는? 힌트를 가져 주셔서 감사합니다.

Answer 1

formControl의 엉망진창입니다. 사용자 정의 FormControl을 만드는 동안, (FormControl의 API 참조) 아래 구문을 사용합니다

옵션 1 :

// for single validator 
customControl = new FormControl('value', Validators.maxLength(5)); 

// for multiple validators(with Validators.compose) 
customControl = new FormControl('value', Validators.compose([Validators.minLength(4), Validators.required])); 
// or(without Validators.compose) 
customControl = new FormControl('value', Validators.compose([Validators.minLength(4), Validators.required])); 

---

가 문제를 해결하는 것입니다 아래의 방법 중 하나에 formGroup 코드 변경 : 사용하지 않고 양식 그룹 만들기 new FormControl()

this.imm = new FormGroup({ 
    comune: [], 
    provincia: [], 
    comuneObj: [], 
    cap: [], 
    indirizzo: [], 
    civico: [], 
    localita: ['', Validators.compose([Validators.minLength(4), Validators.required])], 
    destinazioneUso: [], 
    destinazioneUsoAltro: [], 
    destinazioneUsoPrincipale: [], 
    destinazioneUsoSecondaria: [], 
}); 

옵션 2 : formControl 부분 구문을 수정하십시오.

this.imm = new FormGroup({ 
    comune: new FormControl(), 
    provincia: new FormControl(), 
    comuneObj: new FormControl(), 
    cap: new FormControl(), 
    indirizzo: new FormControl(), 
    civico: new FormControl(), 
    localita: new FormControl('', Validators.compose([Validators.minLength(4), Validators.required])), 
    destinazioneUso: new FormControl(), 
    destinazioneUsoAltro: new FormControl(), 
    destinazioneUsoPrincipale: new FormControl(), 
    destinazioneUsoSecondaria: new FormControl(), 

});