角度7中的文件验证

Question

在上传到服务器之前，如何验证文件大小和文件类型之类的文件。以及如何将这种验证与反应形式或模板驱动方法一起使用。

Answer 1

您可以获取更改事件并检查文件的大小和类型

在您的ts文件中，具有此方法。

readFile(fileEvent: HTMLInputEvent) {
   const file: File = fileEvent.target.files[0];
   console.log('size', file.size);
   console.log('type', file.type);
}

并且在您的html中处理onchange事件

<input (change)="handleFiles($event)" type="file" />

Answer 2

问题几乎可以通过HTML本身解决。不需要角度相关的东西。

 <form action="/action_page.php">
     <input type="file" name="pic" accept="image/*">
     <input type="submit">
 </form> 

accept属性可以按如下方式使用：

<input accept="file_extension|audio/*|video/*|image/*|media_type"> 

accept参数的解释如下：

• file_extension指定用户可以选择的文件扩展名（例如：.gif，.jpg，.png，.doc）。
• 音频/ *
用户可以选择所有声音文件
• video / *
用户可以选择所有视频文件
• 图像/ *
用户可以选择所有图像文件
• media_type
有效的媒体类型，没有参数。查看IANA Media Types以获取标准媒体类型的完整列表

希望这会有所帮助：）