如何在ionic中使用listDir()方法在屏幕上显示目录文件

// home.page.ts
import { Component } from '@angular/core';
import { File } from '@ionic-native/file/ngx';

@Component({
  selector: 'app-home',
  templateUrl: 'home.page.html',
  styleUrls: ['home.page.scss'],
})
export class HomePage {
  files: any[] = [];

  constructor(private file: File) {}

  ionViewDidEnter() {
    this.listFiles('/storage/emulated/0/Download'); // 替换为你想要列出文件的目录路径
  }

  listFiles(path: string) {
    this.file.listDir(path, '').then((entries) => {
      this.files = [];
      for (let entry of entries) {
        this.files.push(entry.name);
      }
    }).catch((err) => {
      console.error('Error listing directory', err);
    });
  }
}

<!-- home.page.html -->
<ion-header>
  <ion-toolbar>
    <ion-title>文件列表</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>
    <ion-item *ngFor="let file of files">
      {{ file }}
    </ion-item>
  </ion-list>
</ion-content>

// 在AndroidManifest.xml中添加权限
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

// 在运行时请求权限
import { Permissions } from '@ionic-native/permissions/ngx';

constructor(private permissions: Permissions) {
  this.permissions.requestPermission([this.permissions.READ_EXTERNAL_STORAGE, this.permissions.WRITE_EXTERNAL_STORAGE]).then(() => {
    // 权限请求成功后，再调用listDir()
    this.listFiles('/storage/emulated/0/Download');
  });
}