Javascript 无法创建属性'；验证器'；关于字符串'；文件'；

我创建了一个动态数组表单，这样我可以添加无限量的项目

.html文件 "

视频数量
{{i}
视频{{i+1}

选择视频：
{{progressVideo | async}}已完成%
文件编号
{{i}
文档{{i+1}

选择文档：
{{progressDoc | async}}已完成%

" .ts文件 "

ngOnInit（）{
this.uploadForm=this.formBuilder.group({
uploadName:[''，验证程序。必需]，
上传价格：[''，验证器。必需]，
uploadAuthor:[''，验证器。必需]，
Uploades:[''，需要验证程序]，
上载映像：[''，验证程序。必需]，
numberofVideo:['']，
视频：新FormArray（[]），
numberofDoc:['']，
文件：新格式（[]）
})
}
得到f（）{
返回this.uploadForm.controls；
}
得到t（）{
将此f.视频作为FormArray返回；
}
得到x（）{
将本文件作为正式文件返回；
}
onChangeVideo（e）{
const numberOfVideo=e.target.value | | 0；
如果（此t.length

"

错误 html:46错误：找不到路径为“videos->uploadVideo”的控件 AdminComponent.html:66错误类型错误：无法在字符串“documents”上创建属性“validator”

---

AdminComponent.html:66错误类型错误：this.form.get不是函数

将此

formGroup=“documents”

更改为此

[formGroup]=“documents”

或

formGroupName=“documents”

新错误AdminComponent.html:46错误：formGroup需要一个formGroup实例。请把一个传进来。示例：在类中：this.myGroup=new-FormGroup（{firstName:new-FormControl（）}）；不能在模板中的formGroup之外声明formControlName。您需要将整个表单包装起来：

add[formGroup]=“uploadForm”

在第一个div中

<div class="row" style="margin-bottom: 10px;margin-top: 10px;">
            <div class="col">
                <label>Number of videos</label>
                <select formControlName="numberofVideo" class="form-control" (change)="onChangeVideo($event)">
                <option value=""></option>
                <option *ngFor="let i of [1,2,3,4,5,6,7,8,9,10]">{{i}}</option>
                </select>
                <div *ngFor="let ticket of t.controls; let i = index;">
                    <div formGroupName="videos">
                        <p style="margin-top: 5px;">Video {{i+1}}</p>
                        <div>
                            Select Video: <input (change)="postVideo($event)" formControlName="uploadVideo" type="file" id="uploadVideo" name="uploadVideo">
                            <div class="progress " style="margin-top: 5px; height: 20px; ">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-success " role="progressbar " [style.width]="(progressVideo | async) + '%' " [attr.aria-valuenow]="(progressVideo | async) " aria-valuemin="0 " aria-valuemax="100 ">
                                </div>
                                {{ progressVideo | async }}% Complete
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col">
                <label>Number of Document</label>
                <select formControlName="numberofDoc" class="form-control " (change)="onChangeDoc($event)">
                <option value=""></option>
                <option *ngFor="let i of [1,2,3,4,5,6,7,8,9,10]">{{i}}</option>
                </select>
                <div *ngFor="let video of x.controls;let i = index;">
                    <div formGroup="documents">
                        <p style="margin-top: 5px;">Document {{i+1}}</p>
                        <div>
                            Select Document: <input (change)="postDoc($event)" formControlName="uploadDocument" type="file" id="uploadDocument" name="uploadDocument">
                            <div class="progress " style="margin-top: 5px; height: 20px; ">
                                <div class="progress-bar progress-bar-striped progress-bar-animated bg-success" role="progressbar " [style.width]="(progressDoc | async) + '%' " [attr.aria-valuenow]="(progressDoc | async) " aria-valuemin="0 " aria-valuemax="100 ">
                                </div>
                                {{ progressDoc | async }}% Complete
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

ngOnInit() {
    this.uploadForm = this.formBuilder.group({
      uploadName: ['',Validators.required],
      uploadPrice: ['',Validators.required],
      uploadAuthor: ['',Validators.required],
      uploadDes: ['',Validators.required],
      uploadImage: ['',Validators.required],
      numberofVideo: [''],
      videos: new FormArray([]),
      numberofDoc: [''],
      documents: new FormArray([])
    })
  }



get f(){
    return this.uploadForm.controls;
  }
  get t(){
    return this.f.videos as FormArray;
  }
  get x(){
    return this.f.documents as FormArray;
  }

  onChangeVideo(e){
    const numberOfVideo = e.target.value || 0;
    if(this.t.length < numberOfVideo){
      for(let i=this.t.length;i<numberOfVideo;i++){
        this.t.push(this.formBuilder.group({
          uploadVideo: new FormControl('')
        }));
      }
    }else{
      for(let i = this.t.length; i >= numberOfVideo;i--){
        this.t.removeAt(i)
      }
    }
  }

  onChangeDoc(e){
    const numberOfDoc = e.target.value || 0;
    if(this.x.length < numberOfDoc){
      for(let i=this.x.length;i<numberOfDoc;i++){
        this.x.push(this.formBuilder.group({
          uploadDocument:new FormControl('')
        }));
      }
    }else{
      for(let i = this.x.length; i >= numberOfDoc;i--){
        this.x.removeAt(i)
      }
    }
  }