각 4 형식, 비활성화 된 필드는 항상 유효합니다.

Question

이상한 형식처럼 보일 수 있지만 여기에 질문을 위해 단순화 한 것은 실제 형식이 아닙니다. 그러나 여기에서도 같은 시나리오가 발생합니다.

<form (ngSubmit)="submit(form)" #form="ngForm"> 
    <div> 
     Full name: 
     <input name="fullName" required> 
    </div> 
    <div> 
     Would you like to receive birthday gifts from us? 
     <input type="checkbox" name="gifts" [(ngModel)]="isAddressEditable"> 
    </div> 
    <div> 
     Gift shipping address: 
     <input name="giftAddress" required [disabled]="!isAddressEditable"> // false (disabled) by default 
    </div> 

    <button type="submit" [disabled]="form.invalid">Register now!</button> 
</form> 

그래서 우리는 3 개의 필드가있는 템플릿 중심 양식을 가지고 있습니다. "지금 등록하십시오!" 양식이 유효하지 않으면 버튼이 비활성화됩니다.

"Gift shipping address"필드가 비활성화되어있는 한 양식 유효성 검사에 포함되지 않으며 전체 이름을 입력하여 양식을 유효하게 만들면 충분합니다.

확인란을 선택하면 ("생일 축하 메시지를 받으시겠습니까?") 입력이 더 이상 사용되지 않으므로 유효성 검사가 적용됩니다.

잘 설계된 동작인지 확실하지 않지만 사용하지 않도록 설정된 필드에도 유효성 검사를 적용 할 수 있는지 궁금합니다.

Answer 1

내가 아는 한, 전에도 같은 문제가있었습니다. 나는 입력에서 "disabled"대신에 "readonly"를 사용하여 그것을 고쳤다.

<input name="giftAddress" required [readonly]="!isAddressEditable"> // false (disabled) by default 

위의 제안을 시도해 볼 수 있습니까?