1

Hola estoy tratando de hacer un explorador de archivos para android en ionic 3 siguendo un tutorial (https://ampersandacademy.com/tutorials/ionic-framework-3/get-android-internal-storage-file-system-information-using-ionic3) y no me funciona. Uso ionic v3.20.0 cordova v8.0.0 npm v5.6.0 node v8.11.1

Instalo el plugin de cordova

ionic cordova plugin add cordova-plugin-file

No da error. Instalo:

npm install --save @ionic-native/file

Este da un problema con una dependencia (no se si tenga algo que ver):

PS D:\Trabajo\Ionic\Proyecto\myApp> npm install --save @ionic-native/file
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: [email protected] (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for [email protected]: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ @ionic-native/[email protected]
updated 1 package in 9.61s

En app.modules.ts añado el plugin File

providers: [File,
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler}
  ]  

Este es prueba.ts

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { File } from '@ionic-native/file';

/**
 * Generated class for the PruebaPage page.
 *
 * See https://ionicframework.com/docs/components/#navigation for more info on
 * Ionic pages and navigation.
 */

@IonicPage()
@Component({
  selector: 'page-prueba',
  templateUrl: 'prueba.html',
})
export class PruebaPage {

  nativepath: string;
  applicationDirectory='';
  applicationStorageDirectory='';
  dataDirectory='';
  cacheDirectory='';
  externalApplicationStorageDirectory='';
  externalDataDirectory='';
  externalCacheDirectory='';
  externalRootDirectory='';
  tempDirectory='';
  getFreeDiskSpace:any=''; 

  constructor(public navCtrl: NavController, public navParams: NavParams, private fileCtrl: File) {
    this.goToDir();
  } 

  ionViewDidLoad() {
    console.log('ionViewDidLoad PruebaPage');
  }

  public goToDir()
  {
    this.applicationDirectory=this.fileCtrl.applicationDirectory;
    this.applicationStorageDirectory=this.fileCtrl.applicationStorageDirectory;
    this.dataDirectory=this.fileCtrl.dataDirectory;
    this.cacheDirectory=this.fileCtrl.cacheDirectory;
    this.externalApplicationStorageDirectory=this.fileCtrl.externalApplicationStorageDirectory;
    this.externalDataDirectory=this.fileCtrl.externalDataDirectory;
    this.externalCacheDirectory=this.fileCtrl.externalCacheDirectory;
    this.externalRootDirectory=this.fileCtrl.externalRootDirectory;
    this.tempDirectory=this.fileCtrl.tempDirectory;
    this.fileCtrl.getFreeDiskSpace().then(data=>{
      this.getFreeDiskSpace=data;
    })


}


}

Este es prueba.html

<!--
  Generated template for the PruebaPage page.

  See http://ionicframework.com/docs/components/#navigation for more info on
  Ionic pages and navigation.
-->
<ion-header>

  <ion-navbar>
    <ion-title>Directorio</ion-title>
  </ion-navbar>

</ion-header>


<ion-content padding>

  <h3>File Directory Info</h3>
  <ion-list>
      <ion-item text-wrap>
          <div class="name">applicationDirectory </div>
          <div class="value">{{applicationDirectory}}</div>
      </ion-item>

      <ion-item text-wrap>
          <div class="name">applicationStorageDirectory </div>
          <div class="value">{{applicationStorageDirectory}}</div>
      </ion-item>

      <ion-item text-wrap>
          <div class="name">dataDirectory </div>
          <div class="value">{{dataDirectory}}</div>
      </ion-item>
      <ion-item text-wrap>
          <div class="name">cacheDirectory </div>
          <div class="value">{{cacheDirectory}}</div>
      </ion-item>
      <ion-item text-wrap>
          <div class="name">externalApplicationStorageDirectory </div>
          <div class="value">{{externalApplicationStorageDirectory}}</div>
      </ion-item>
      <ion-item text-wrap>
          <div class="name">externalDataDirectory </div>
          <div class="value">{{externalDataDirectory}}</div>
      </ion-item>
      <ion-item text-wrap>
          <div class="name">externalCacheDirectory </div>
          <div class="value">{{externalCacheDirectory}}</div>
      </ion-item>
      <ion-item text-wrap>
          <div class="name"> externalRootDirectory</div>
          <div class="value">{{externalRootDirectory}}</div>
      </ion-item>
      <ion-item text-wrap>
          <div class="name">tempDirectory </div>
          <div class="value">{{tempDirectory}}</div>
      </ion-item>
      <ion-item text-wrap>
          <div class="name"> getFreeDiskSpace</div>
          <div class="value">{{getFreeDiskSpace}}</div>
      </ion-item>
</ion-list>

</ion-content>

Esto es lo que muestra el navegador al insertar el comando ionic serve: esto es lo que muestra el navegador al insertar el comando ionic serve

1 respuesta 1

1

Cambia el comando de instalación:

npm install --save @ionic-native/file

Por:

npm install --save @ionic-native/file@4

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.