[英]Angular2 How to trigger (click) event
我有一個div
和ion-input #fileInput type="file" accept="image/*" id="fileInput" [(ngModel)]="imageFilePath" (ionChange)="imageFilePath_change($event)" ></ion-input>
如何使用div
模擬ion-input
組件上的點擊?
我的html代碼是:
<div (click) = "fileInput.click()">
<img src="assets/img/camera_button.png" [ngStyle]="{'position': 'fixed', 'top': '30vw', 'left': '32vw', 'height': '30px', 'color': '#0080FF'}">
<ion-input #fileInput type="file" accept="image/*" id="fileInput" [(ngModel)]="imageFilePath" (ionChange)="imageFilePath_change($event)" ></ion-input>
<span [ngStyle]="{'position': 'fixed', 'top': '32vw', 'left': '42vw', 'color': '#0080FF'}">{{ 'addMorePhotosBtn' | translate }}</span>
</div>
錯誤是:
TypeError: jit_nodeValue_20(...).click is not a function
這是單擊div時文件的我的工作示例。
HTML文件
<ion-list>
<ion-item (click)="onImageClick()">
<div>
<ion-icon ios="ios-add-circle" md="md-add-circle"></ion-icon>
Add Files
</div>
</ion-item>
</ion-list>
打字稿文件
public onImageClick() {
let input = document.createElement('input');
input.setAttribute('type', 'file');
input.setAttribute('accept', 'image/*'); //you can change also file type as **'file/*'**
input.setAttribute("multiple", ""); // If you dont want multiple select file pls remove this line
input.addEventListener('change', (event: any) => {
let fileList: File[] = event.target.files;
console.log("File List Object Value",fileList);
});
input.click();
}
對我來說完美的測試。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.