文件输入在<ion-menu>中无效

时间:2017-08-09 06:47:20

标签: angular file ionic-framework ionic3

虽然我的应用程序中没有离子菜单,但它工作正常,但在将其添加到我的代码后:

<ion-menu [content]="content">
<ion-header>
  <ion-toolbar>
    <ion-title>Menu</ion-title>
  </ion-toolbar>
</ion-header>
<ion-content>
  <ion-list>
    <ion-item-sliding *ngFor="let file of fileNames;let i = index;" #item>
      <ion-item [ngClass]="{ 'active':i == isActive}" ion-long-press [interval]="400" (onPressStart)="fileChosen(i)">
        {{file}}
  <button ion-button (click)="deleteFile(i)">Delete file</button>

      </ion-item>
      <ion-item-options side="left" (ionSwipe)="save()">

        <button ion-button color="danger" (click)="moreInfo(item)">More Info</button>
      </ion-item-options>
    </ion-item-sliding>
  </ion-list>

  <input type="file" (change)="uploadFile($event)">
  <button  (click)="doSome()" [disabled]="isFileChosen">DOSOME</button>
</ion-content>
<ion-nav id="nav" #content [root]="rootPage"></ion-nav>

文件输入在设备上停止打开文件对话框,但在浏览器中打开它。我认为这个问题出现在事件中,因为菜单会通过滑动打开,但不知道如何解决这个问题。请帮帮我

的package.json

  

{       &#34; name&#34;:&#34; myApp&#34;,

"version": "0.0.1",
"author": "Ionic Framework",
"homepage": "http://ionicframework.com/",
"private": true,
"scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
},
"dependencies": {
    "@angular/common": "4.1.3",
    "@angular/compiler": "4.1.3",
    "@angular/compiler-cli": "4.1.3",
    "@angular/core": "4.1.3",
    "@angular/forms": "4.1.3",
    "@angular/http": "4.1.3",
    "@angular/platform-browser": "4.1.3",
    "@angular/platform-browser-dynamic": "4.1.3",
    "@ionic-native/core": "3.12.1",
    "@ionic-native/splash-screen": "3.12.1",
    "@ionic-native/status-bar": "3.12.1",
    "@ionic/storage": "2.0.1",
    "b-spline": "^2.0.1",
    "canvasjs": "^1.8.1",
    "chart.js": "^2.6.0",
    "chartjs": "^0.3.24",
    "cordova-android": "^6.2.3",
    "cordova-plugin-compat": "^1.1.0",
    "cordova-plugin-device": "^1.1.4",
    "cordova-plugin-file": "^4.3.3",
    "cordova-plugin-splashscreen": "^4.0.3",
    "cordova-plugin-statusbar": "^2.2.2",
    "cordova-plugin-whitelist": "^1.3.1",
    "ionic-angular": "3.6.0",
    "ionic-long-press": "^1.2.0",
    "ionic-plugin-keyboard": "^2.2.1",
    "ionicons": "3.0.0",
    "rxjs": "5.4.0",
    "sw-toolbox": "3.6.0",
    "zone.js": "0.8.12"
},
"devDependencies": {
    "@ionic/app-scripts": "2.1.3",
    "@ionic/cli-plugin-cordova": "1.6.2",
    "@ionic/cli-plugin-ionic-angular": "1.4.1",
    "ionic": "3.7.0",
    "typescript": "2.3.4"
},
"description": "An Ionic project",
"cordova": {
    "plugins": {
        "cordova-plugin-device": {},
        "cordova-plugin-splashscreen": {},
        "cordova-plugin-statusbar": {},
        "cordova-plugin-whitelist": {},
        "ionic-plugin-keyboard": {},
        "cordova-plugin-file": {}
    },
    "platforms": [
        "android"
    ]
} }

1 个答案:

答案 0 :(得分:1)

您需要使用swipe,如下所示。现在没有(ionSwipe)

 <ion-item-options side="left" (swipe)="save($event)">

也请参阅:swipe