Как включить и отключить входной файл при переключении радиобаттона?

Question

У меня есть форма, и мне нужно отключить и отключить управление в той же форме в зависимости от положения переключателя

<form [formGroup]="service.form" #signUpForm="ngForm" class="normal-form">
    --------------------------------------------------------------
    <mat-radio-group formControlName="role">
        <mat-radio-button value="1">Patient</mat-radio-button>
        <mat-radio-button value="2">Doctor</mat-radio-button>
     </mat-radio-group>
    --------------------------------------------------------------
    <input type="file" #Image accept="image/*" [disabled]="service.form.role==1">
</form>

Как мне это сделать?

Answer 1

Вы не получите role на service.form.service.form будет иметь свойство value, для которого вы получите это свойство role.

Просто используйте service.form.value.role вместо service.form.role

<form [formGroup]="form" #signUpForm="ngForm" class="normal-form">
    <mat-radio-group formControlName="role">
        <mat-radio-button value="1">Patient</mat-radio-button>
        <mat-radio-button value="2">Doctor</mat-radio-button>
     </mat-radio-group>
    <br>
    <input type="file" #Image accept="image/*" [disabled]="form.value.role==1">
</form>

Вот Образец Stackblitz для вашей ссылки.

Answer 2

Просто дайте ссылку на элемент роли и используйте ссылку, чтобы отключить и включить другой элемент управления.

<form [formGroup]="service.form" #signUpForm="ngForm" class="normal-form">
    --------------------------------------------------------------
    <mat-radio-group #role formControlName="role">
        <mat-radio-button value="1">Patient</mat-radio-button>
        <mat-radio-button value="2">Doctor</mat-radio-button>
     </mat-radio-group>
    --------------------------------------------------------------
    <input type="file" #Image accept="image/*" [disabled]="role.value==1">
</form>