上传和验证-打字稿和角度

时间:2018-12-01 04:12:20

标签: angular typescript

这只是应用程序的功能,可在上传之前检查文件扩展名和大小。无需读取数据。示例将不胜感激。 谢谢

1 个答案:

答案 0 :(得分:0)

这也可以通过普通的javascript实现。打字稿是javascript的超集。您可以编写一个函数来检查文件大小和扩展名。在此之前,您需要从视图向函数发送事件。

因此在角度上,您可以尝试

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

在打字稿中,您可以编写一个函数来检查事件,例如

 fileEvent(e) {

    /// get list of files
    let file_list = e.target.files;

    /// go through the list of files
    for (let i = 0, file; file = file_list[i]; i++) {

        let sFileName = file.name;
        let sFileExtension = sFileName.split('.')[sFileName.split('.').length - 1].toLowerCase();
        let iFileSize = file.size;
        let iConvert = (file.size / 1048576).toFixed(2);

        /// OR together the accepted extensions and NOT it. Then OR the size cond.
        /// It's easier to see this way, but just a suggestion - no requirement.
        if (!(sFileExtension === "pdf" ||
              sFileExtension === "doc" ||
              sFileExtension === "docx") || iFileSize > 10485760) { /// 10 mb
            txt = "File type : " + sFileExtension + "\n\n";
            txt += "Size: " + iConvert + " MB \n\n";
            txt += "Please make sure your file is in pdf or doc format and less than 10 MB.\n\n";
            alert(txt);
        }
    }
}