Hej
Robię swój pierwszy formularz i coś mi nie idzie ... Wszystko się pokazuję bez błędów, ale nie mogę zaznaczyć radio button.
export class AppComponent implements OnInit {
form;
constructor(fb: FormBuilder) {
this.form = fb.group({
productName: [' ', Validators.compose([
Validators.required,
Validators.maxLength(40),
Validators.minLength(3)])],
productWeightCategory: fb.group({
id: [],
categoryWeightName: []
})
});
onSubmit(form: ReactiveFormsModule) {
console.log(this.form);
console.log(JSON.stringify(form));
}
get productName() {
return this.form.get('productName');
}
get productWeightCategory() {
return [{id: 2, categoryWeightName: 'asd'}, {id: 1, categoryWeightName: 'asd1'}, {id: 3, categoryWeightName: 'asd3'}];
}
}
oraz html
<form class="container col-md-2" [formGroup]="form" (ngSubmit)="onSubmit(form.value)">
<div>
<label for="productName">Nazwa produktu</label>
<input class="form-control" id="productName" type="text" placeholder="" formControlName="productName">
<span class="small help-block"></span>
<div *ngIf="productName.touched && productName.invalid" class="alert alert-danger">
<div *ngIf="productName.errors.minlength ">Nazwa produktu nie może zawierać mniej niż {{productName.errors.minlength.requiredLength}} znaki</div>
<div *ngIf="productName.errors.maxlength ">Nazwa produktu nie może zawierać wiecej niż {{productName.errors.maxlength.requiredLength}} znaków</div>
<div *ngIf="productName.errors.required">Pole wymagane</div>
</div>
</div>
<div>
<label for="radios">Kategoria </label>
<div formGroupName="productWeightCategory">
<div class="radio" *ngFor="let element of productWeightCategory">
<label>
<input formControlName="id" [value]="element" type="radio" name="id" >
{{element.categoryWeightName}}
</label>
</div>
</div>
</div>
<input class="btn btn-primary" type="submit" [disabled]="!form.valid" value="Dodaj">
</form>
Z góry dzięki za pomoc