admin管理员组文章数量:1327682
i have a edit form in angular 8 and use the form array in that .
i need when i enter that page it fill the form array with value but when i enter the page it not fill the form .
whats the problem ???
ngOnInit(): void {
this.courseExam = this.activeRoute.snapshot.data['exams']['exams']['records'];
this.questions = this.activeRoute.snapshot.data['question']['question']["result"];
this.questionsOld = this.activeRoute.snapshot.data['question']['question']["result"];
console.log(this.questions)
this.createForm();
}
createForm(): void {
this.editQuestionFG = new FormGroup({
title: new FormControl(this.questions.title, Validators.required),
courseExamId: new FormControl(this.questions.courseExamId, Validators.required),
courseOptions: this._formBuilder.array([])
});
this.setValue(this.questions.courseOptions);
}
createItem(): FormGroup {
return this._formBuilder.group({
optionTitle: new FormControl('', Validators.required),
isCorrect: new FormControl(false, Validators.required)
});
}
setValue(item: Options[]) {
for (let x of item) {
this.editQuestionFG.controls['courseOptions'].setValue({
isCorrect: x.isCorrect,
optionTitle: x.optionTitle
})
}
}
html :
<div class="answer col-lg-12 kt-margin-bottom-20-mobile">
<div formArrayName="courseOptions" class="row m-auto"
*ngFor="let project of editQuestionFG.get('courseOptions').controls; let i = index">
<ng-container [formGroupName]="i">
<div class="col-lg-1 kt-margin-bottom-20-mobile icon remove text-center">
<label (click)="deleteItem(i)"><i class="la la-trash"></i></label>
</div>
<div class="col-lg-8 kt-margin-bottom-20-mobile">
<mat-form-field class="mat-form-field-fluid" appearance="outline">
<mat-label>{{'GENERAL.TITLE' | translate}} *</mat-label>
<input matInput formControlName="optionTitle"
[placeholder]="'GENERAL.TITLE' | translate">
</mat-form-field>
</div>
<div class="col-lg-3 kt-margin-bottom-20-mobile icon">
<mat-radio-group name="radp" aria-label="Select an option"
formControlName="isCorrect">
<mat-radio-button value='true'>صحیح</mat-radio-button>
</mat-radio-group>
</div>
</ng-container>
</div>
<div class="add-Item">
<button (click)="AddItems()" mat-raised-button type="button"
color="accent">{{'COURSE_QUESTION.ADD_NEW_OPTION' |translate}}</button>
</div>
</div>
whats the problem ? how can i solve this problem ????
i have a edit form in angular 8 and use the form array in that .
i need when i enter that page it fill the form array with value but when i enter the page it not fill the form .
whats the problem ???
ngOnInit(): void {
this.courseExam = this.activeRoute.snapshot.data['exams']['exams']['records'];
this.questions = this.activeRoute.snapshot.data['question']['question']["result"];
this.questionsOld = this.activeRoute.snapshot.data['question']['question']["result"];
console.log(this.questions)
this.createForm();
}
createForm(): void {
this.editQuestionFG = new FormGroup({
title: new FormControl(this.questions.title, Validators.required),
courseExamId: new FormControl(this.questions.courseExamId, Validators.required),
courseOptions: this._formBuilder.array([])
});
this.setValue(this.questions.courseOptions);
}
createItem(): FormGroup {
return this._formBuilder.group({
optionTitle: new FormControl('', Validators.required),
isCorrect: new FormControl(false, Validators.required)
});
}
setValue(item: Options[]) {
for (let x of item) {
this.editQuestionFG.controls['courseOptions'].setValue({
isCorrect: x.isCorrect,
optionTitle: x.optionTitle
})
}
}
html :
<div class="answer col-lg-12 kt-margin-bottom-20-mobile">
<div formArrayName="courseOptions" class="row m-auto"
*ngFor="let project of editQuestionFG.get('courseOptions').controls; let i = index">
<ng-container [formGroupName]="i">
<div class="col-lg-1 kt-margin-bottom-20-mobile icon remove text-center">
<label (click)="deleteItem(i)"><i class="la la-trash"></i></label>
</div>
<div class="col-lg-8 kt-margin-bottom-20-mobile">
<mat-form-field class="mat-form-field-fluid" appearance="outline">
<mat-label>{{'GENERAL.TITLE' | translate}} *</mat-label>
<input matInput formControlName="optionTitle"
[placeholder]="'GENERAL.TITLE' | translate">
</mat-form-field>
</div>
<div class="col-lg-3 kt-margin-bottom-20-mobile icon">
<mat-radio-group name="radp" aria-label="Select an option"
formControlName="isCorrect">
<mat-radio-button value='true'>صحیح</mat-radio-button>
</mat-radio-group>
</div>
</ng-container>
</div>
<div class="add-Item">
<button (click)="AddItems()" mat-raised-button type="button"
color="accent">{{'COURSE_QUESTION.ADD_NEW_OPTION' |translate}}</button>
</div>
</div>
whats the problem ? how can i solve this problem ????
Share Improve this question asked Sep 1, 2019 at 13:39 kianousj dortajkianousj dortaj 753 silver badges9 bronze badges1 Answer
Reset to default 6Try like this:
setValue(item: Options[]) {
const formArray = new FormArray([]);
for (let x of item) {
formArray.push(this._formBuilder.group({
isCorrect: x.isCorrect,
optionTitle: x.optionTitle
}));
}
this.editQuestionFG.setControl('courseOptions', formArray);
}
本文标签: javascriptset value in form array in angular 8Stack Overflow
版权声明:本文标题:javascript - set value in form array in angular 8 - Stack Overflow 内容由网友自发贡献,该文观点仅代表作者本人, 转载请联系作者并注明出处:http://www.betaflare.com/web/1742216509a2434662.html, 本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。
发表评论