通过角度编程打开上传对话框答案

【问题标题】：open upload dialog by programility in angular通过角度编程打开上传对话框
【发布时间】：2020-09-14 02:36:26
【问题描述】：

我想通过 angular 9 中的打字稿打开上传对话框。

我不想用这种方式：创建输入和dispaly:none

<input type="file" ng2FileSelect [uploader]="uploader" style="display: none" />

我想用代码打开文件上传对话框。

如何在没有创建输入文件的情况下只使用打字稿或javascript代码打开上传文件对话框？

【问题讨论】：

我认为没有办法实现这一点，除非实际上有某种实现来处理文件上传。因此，要么你需要完全重新实现通常负责文件上传的整个 API，要么有一个隐藏的输入，你可能会触发如下所述：stackoverflow.com/questions/37320135/…
到目前为止，您在 typescript/javascript 中尝试过什么？这是一个非常开放的问题，您没有提供任何帮助我们帮助您的信息

【解决方案1】：

如果没有文件输入，则无法打开文件浏览器。由于安全问题，此文件输入是只读输入的一种方式，并且可以在单击时工作。然后你需要文件输入来打开对话框。

一种方法是使用 Viewchild 并触发点击它。

在 html 中写入 Viewchild 名称

<input type="file"  style="display: none;" #file />

在组件中可以在ngAfterViewInit中调用

 @ViewChild("file") file : ElementRef;

  ngAfterViewInit(){
    console.log(this.file.nativeElement);
    this.file.nativeElement.click(); 
  }

【讨论】：