首页 文章

触摸输入文件在页面更改后单击Ionic 4

提问于
浏览 次
11

我想触发/打开来自Ionic 4中另一页的文件输入 .

在第1页中，我有一个按钮可以转到模态，在页面模态中我想自动触发 <input file> 对话框

零件

ionViewWillEnter() {
    document.getElementById('file').click(); // Tried with this one 1st, this only works in Internet Explorer / Edge
    this.fileInput.nativeElement.click();    // And also this with @ViewChild
}

HTML

<input type="file" name="file" #file id="file" (change)="fileChange($event)" required>
javascript html angular ionic-framework

4 回答

  • 2

    这是我用来触发<input> -element上的点击的代码：

    @ViewChild("file") fileInput: ElementRef;

triggerClick() {
    let event = new MouseEvent('click', {bubbles: true});
    this.renderer.invokeElementMethod(this.fileInput.nativeElement, 'dispatchEvent', [event]);
}
    回复于
  • 3

    改变这个：

    ionViewWillEnter() {
    document.getElementById('file').click(); // Tried with this one 1st
    this.fileInput.nativeElement.click();    // And also this with @ViewChild
}

    对此：

    ionViewDidLoad() {
    document.getElementById('file').click(); // Tried with this one 1st
}
    回复于
  • 2

    尝试ngAfterViewInit（）在组件视图完全初始化后调用的生命周期钩子 .

    ngAfterViewInit() {
    document.getElementById('file').click();
}
    回复于
  • 1

    我解决了它在page1中插入一个隐藏的输入文件，当用户试图转到page2时我触发了文件输入 .

    当用户完成选择文件时，我将文件事件更改发送到第2页并管理第2页中的所有逻辑 .

    回复于

相关问题