Question

我在Html文件中有这段代码。

<input #fileInput type="file"  />

demo.ts

import {
  Component,
  Inject,
  OnInit,
  ElementRef,
  Renderer,
  ViewQuery
} from '@angular/core';
@Component({
  selector: 'demo',
  templateUrl: 'client/dev/demo/demo.html',
})
export class DemoComponent implements OnInit{

@ViewQuery('fileInput') fileInput:ElementRef;

constructor(){}

triggerFile(){
   // do something 
   // trigger input type="file" here
   this.fileInput.nativeElement.click();
}

ngOnInit() {


}

}

我看到了这个答案：how to trigger click event of input file from button click in angular 2? 当然有效。但我想在triggerFile（）函数中触发input type =“file”，我使用ViewQuery和nativeElement.click（）函数。但它控制此错误“无法读取未定义的属性'nativeElement'”。我使用angular2 Rc 1。谢天谢地。

Answer 1

将fileInput引用传递给triggerFile()，然后执行fileInput.click()：

<input #fileInput type="file"  />
<button type="button" (click)="triggerFile(fileInput)">trigger</button>

triggerFile(fileInput:Element) {
  // do something
  fileInput.click();
}

Answer 2

无需在控制器中编写代码

<input #fileInput type="file"  />
<button type="button" (click)="fileInput.click()">trigger</button>

如何通过角度2中的函数触发事件单击输入类型=“文件”？

2 个答案: