输入单击事件在带有ionic 2和angular2的IOS设备上不起作用

Question

我尝试使用ionic 2项目上传图片。 我需要向客户提供样式，并且它可以与Android浏览器一起使用。 但在ios设备上不起作用。

我尝试设置样式：cursor：point。 但这也没醒。
的HTML：

 <div class="upload-box J_UploadBox"  (click)="fileSelect.click()">
    <input class="J_UploadData" type="hidden" value="">
    <div class="box-do"><ion-icon name="camera"></ion-icon>
      <span class="must-tip" style="display:none"></span></div>
    <div class="J_Views"><span class="tip">upload image</span></div>
  </div>
  </div>
  <div class="J_UploadInput" >
    <input type="file"   #fileSelect  (change)="onChange($event)"  accept="image/*">
  </div>

CSS：

有谁知道为什么吗？ 谢谢

Answer 1

我有一个类似的难题，可以通过将<input>放在格式如离子按钮的<div>内来解决它，如下所示：

profile.page.html

<div ion-button class="fileUpload">
  <span>Choose Picture</span>
  <input #fileInput class="upload" type="file" (change)="fileChangeListener($event)" />
</div>

profile.page.scss

.fileUpload {
  position: relative;
  overflow: hidden;

  input.upload {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    padding: 0;
    font-size: 20px;
    cursor: pointer;
    opacity: 0;
    filter: alpha(opacity=0);
  }
}