Class
export class AppComponent {
testForm: FormGroup;
msgError: string = 'Este Campo es obligatorio';
opciones = [
{ nombre: 'A''N1', valor: 1 },
{ nombre: 'B''N2', valor: 2 },
{ nombre: 'C''N3', valor: 3 },
{ nombre: 'Otra Respuesta', valor: 4 },
];
constructor constructor(public fb: FormBuilder) {
this.testForm = this.fb.group ( {
'opcionA': [['', ''[Validators.required]],
[ Validators.required ] ],
'observacionA': [new ''FormControl(null)
}, [{
Validators.required ] ] validator: this.specificValue
} });
}
valido valido(): boolean {
return !this.testForm.valid;
}
Html
<form [formGroup]="testForm" }
(ngSubmit)="()" novalidate>
<md-radio-specificValue(group: formControlName="opcionA"
any) {
if (!group.controls.opcionA || !group.controls.opcionA.value) return;
const opcionA = requiredgroup.controls.opcionA.value;
let observacionA = group.controls.observacionA.value;
if (opcionA == '4') >{
<md-radio-button *ngFor="let opcion ofif opciones"(observacionA) {
return {
return: [value]="opcion.valor"null
};
} else >{
return {
isRequired: {{opcion.nombre}}true
</md-radio-button>
<div *ngIf="testForm.get('opcionA').invalid"> };
}
<md-error>{{ msgError }}</md-error>
</div>}
</md-radio-group>
<md-form-field *ngIf="testForm.value.opcionA ===guardar() 4">{
<textarea mdInputconsole.log(this.testForm.value);
}
}
Html
<h1>Form</h1>
<form [formGroup]="testForm" (ngSubmit)="guardar()" novalidate>
<label *ngFor="let opcion of formControlName="observacionA"opciones">
<input type="radio"
formControlName="opcionA"
[errorStateMatcher]="myErrorStateMatcher"
required
>[value]="opcion.valor">{{opcion.nombre}}
</label>
<div </textarea>*ngIf="testForm.get('opcionA').invalid">
<md-error>{{ msgError }}</md-error>
</md-form-field>div>
<button md-raised-button<div class="mt-1"*ngIf="testForm.value.opcionA === 4">
<textarea formControlName="observacionA"></textarea>
color="primary"
<div *ngIf="testForm.get('observacionA').invalid">
{{ msgError type="submit"}}
</div>
</div>
<br>
<hr>
<button [disabled]="valido"
>
Guardar
<md-icon class="example-icon">save</md-icon> type="submit">
Save
</button>
</form>
{{testForm.valid}}