这里是我的情况，代码和来自Stackoverflow的参考。
我想触发打开对话框，我发现引用，但他们似乎不工作;

首先我的代码片段：

<i class="fas fa-upload uploadicon"></i><br>
                Drop document here or 
                <a href="javascript:;" class="dropimgmessage" id="uploadLink" name="uploadLink" ngbTooltip="Click to upload a document or drag here!" placement="top">browse</a>
                <input type="file" class="form-control fileuploader" #fileInput  id="api-file-container" formControlName="docUpload" name="api-file-container" (change)="handleFileInput($event.target.files)">
                <span class="dropimagetypemsg">Supports PDF, JPG, PNG, GIF</span>

现在我的 typescript ：

declaration of variables:
public uploadlink: HTMLElement;
public fileinput: HTMLElement;
------
ngAfterViewInit() {
    this.uploadlink = document.querySelector('#uploadLink') as HTMLElement;
    this.fileinput = document.querySelector('#api-file-container') as HTMLElement;
    this.uploadlink.addEventListener('click', (e: Event) => {
      e.preventDefault();
      this.fileinput.click();
    });
}

发生的事情是，代码会触发，但不会进入片段：

this.uploadlink.addEventListener('click', (e: Event) => {

它在. addEventListener处停止。
所以我试着从HTML调用一个函数onClick，就像这样。

public fakeFileInput(e: Event): void {
    console.log('Fake Input to File Upload: ', e);
     if(this.uploadlink.getAttribute('text') === 'browse') {
       console.log('EVENT browse upload was click: ');
       this.uploadlink.setAttribute('defaultPrevented', 'false');
       this.fileinput.click();
     }
}

通过将该调用添加到函数中，如下所示：

<a href="javascript:;" (click)="fakeFileInput($event)" class="dropimgmessage" id="uploadLink" name="uploadLink" ngbTooltip="Click to upload a document or drag here!" placement="top">browse</a>

现在这是可行的，但是，我在这里得到了一个错误：文件选择器对话框只能在用户激活时显示。
我的参考资料：
Calling a typescript method from your html button onclick event
How to open a file / browse dialog using javascript?
How to make a link act as a file input
在JSFiddle -http://jsfiddle.net/7aGEv/3/上
我哪里做错了？
谢谢你。