Question

我正在使用Ionic原生图像选择器：https://ionicframework.com/docs/native/image-picker/

我在我的模块上导入

import { ImagePicker } from '@ionic-native/image-picker';

并添加模块的提供商

ImagePicker,

在我的页面上我导入

import { ImagePicker, ImagePickerOptions } from '@ionic-native/image-picker';

添加到我的构造函数

private imagePicker: ImagePicker,

然后在按钮上调用方法

async pickImageFromGallery() {
  try {
    const [imageSource] = await this.imagePicker.getPictures(this.pickerOptions);

    this.imgSrc = imageSource;

它确实有用，我可以获取文件URI，但是当我尝试在<img>标记上显示时，图片无法显示

<img src="{{ imgSrc }}" alt="" />

我是否需要配置一些权限或其他内容？为什么图像不显示？

Answer 1

而不是this.imgSrc = imageSource;我做了

this.imgSrc = imageSource.replace('file://', '');

适用于iOS和Android。

如果您遇到Android崩溃等问题，请尝试以下方法：

首先我清理了我的项目

# rm -rf
rimraf .sourcemaps node_modules platforms plugins www

然后安装包

npm i

然后再次部署应用

ionic cordova run android --device

Answer 2

你必须添加＆＃34;＆＃34;在你的src

<img src="{{ imgSrc }}" alt="" />

如何从Ionic原生图像选择器显示图像？

2 个答案: