翻閱古今
2022-10-08 15:24:01
我正在嘗試建立一個網站,提供上傳您自己的課程的功能。課程結構 Name of course |-Module1 |-Lecture1 |-Lecture2 |-Module2 |-Lecture1 |-Lecture2使用 Angular 我正在嘗試創建一個動態表單,它將在課程中添加/刪除模塊并在模塊中進行講座到目前為止,我已經寫了以下內容 -課程上傳.component.tsexport class CourseUploadComponent implements OnInit { courseUploadForm: FormGroup; constructor(private formBuilder: FormBuilder) { } ngOnInit() { this.courseUploadForm = this.formBuilder.group({ coursename: ['', Validators.required], modules: this.formBuilder.array([ this.initModules() ]) }) } initModules() { return this.formBuilder.group({ modulename: ['', Validators.required], lectures: this.formBuilder.array([ this.initLecture() ]) }); } initLecture() { return this.formBuilder.group({ lecturename: ['', Validators.required], description: ['', Validators.required], lecture: ['', Validators.required] }); } addModule() { const control = <FormArray>this.courseUploadForm.get('modules'); control.push(this.initModules()); } addLecture() { const control = <FormArray>this.courseUploadForm.get('lectures'); control.push(this.initLecture()); } removeModule(i: number) { const control = <FormArray>this.courseUploadForm.get('modules'); control.removeAt(i); } removeLecture(i: number) { const control = <FormArray>this.courseUploadForm.get('lectures'); control.removeAt(i); } getModulesControls(i: number) { >>>> return [(this.courseUploadForm.controls.modules as FormArray).controls[i]['controls']]; } getLecturesControls(i: number) { return [(this.courseUploadForm.controls.lectures as FormArray).controls[i]['controls']]; }}我用 ** > ** 突出顯示了引發錯誤的行一些幫助?
2 回答

慕妹3242003
TA貢獻1824條經驗 獲得超6個贊
j
在這里沒有定義它應該是不同的
<ng-container *ngFor="let control of getModulesControls(j)"> <mat-error *ngIf="!control.name.valid">Name Required</mat-error> </ng-container>
我想你打算在i
那里使用變量:getModulesControls(i)
此外,HTML 文件的第 5 行將變量module
定義為 Object。第 23 行module.get('lectures')
看起來您期望變量FormGroup
中有 a。module
看看Angular 文檔中的這個例子。注意 HTML 標記和 TS。您將需要創建幾個 getter,例如get cities(): FormArray
(:

慕尼黑5688855
TA貢獻1848條經驗 獲得超2個贊
我認為您必須檢查給定的數組是否為空。如果為空,則應返回 null,
getModulesControls(i: number) {
if(this.courseUploadForm.controls.modules.length <1){
return null;
}
else{
return [(this.courseUploadForm.controls.modules as FormArray).controls[i]['controls']];
}
}
添加回答
舉報
0/150
提交
取消