如何在Angular 5反应性表单中验证所需的文件上传

时间:2018-12-06 15:47:27

标签: angular validation angular-reactive-forms

我希望用户单击一个按钮一次上载一个文档。

当前,当用户上载文档时,它确实将“文档”控件标记为“满意”。但是,如果用户尝试上载另一个文档,然后单击“取消”,则会将控件标记为不满意。它仍然具有第一个文档,但是在文件浏览器中单击“取消”似乎使验证器认为没有上载任何文档。我该如何解决?

在我的html中:

<input type="file" formControlName="documents" (change)="uploadDocument($event.target.files)">

在我的.ts中:

this.formGroupName=this.formBuilder.group({
  documents: ['', Validators.compose([Validators.required])]
});

现在,我的upoadDocument()函数对验证没有任何作用。

1 个答案:

答案 0 :(得分:1)

所以我自己解决了这个问题。我最终要做的是订阅尝试上载文档时的change事件,然后根据一些条件手动使Validator无效或验证。

有关此主题的更多信息,请参见:How can I manually set an Angular form field as invalid?