即时通讯Builing一个应用程序,我可以拍照,并将其保存到离子存储,但当我保存它们,我启动我的应用程序,我得到以下错误
NullInjectorError: R3InjectorError(RecentPageModule)[PhotoService -> PhotoService -> PhotoService -> Storage -> Storage]:
NullInjectorError: No provider for Storage!
NullInjectorError: R3InjectorError(RecentPageModule)[PhotoService -> PhotoService -> PhotoService -> Storage -> Storage]:
NullInjectorError: No provider for Storage!
at NullInjector.get (core.mjs:8650:27)
at R3Injector.get (core.mjs:9076:33)
at R3Injector.get (core.mjs:9076:33)
at injectInjectorOnly (core.mjs:627:33)
at Module.ɵɵinject (core.mjs:631:60)
at Object.PhotoService_Factory [as factory] (photo.service.ts:21:26)
如果我发现当我在构造函数中调用Storage元素时出现错误,但我需要一个Storage对象来调用后面代码中的set()方法。
有什么建议吗?
import { Injectable } from '@angular/core';
import { Plugins, Capacitor } from '@capacitor/core';
import { Camera,CameraResultType, CameraPhoto } from '@capacitor/camera';
import { FilesystemDirectory,Filesystem } from '@capacitor/filesystem';
import { Platform } from '@ionic/angular';
import { Storage } from '@ionic/storage';
//const {Camera,Filesystem,Storage} = Plugins;
//const {Storage} = '@ionic/storage'
export interface Photo{
filepath:string;
webViewPath: string;
}
@Injectable({
providedIn: 'root'
})
export class PhotoService {
public photo: Photo[]=[];
private PHOTO_STORAGE: string = "photos";
constructor(private platform: Platform,public store: Storage) { }
public async captureImage(){
const image = await Camera.getPhoto({
quality:100,
allowEditing: true,
resultType: CameraResultType.Uri
});
console.log(image)
const imageFile = await this.savePicture(image);
this.photo.unshift(imageFile as any);
console.log(this.photo)
this.store.set(this.PHOTO_STORAGE, JSON.stringify(this.photo))
}
private async savePicture(cameraPhto:CameraPhoto){
const base64Data = await this.readAsBase64(cameraPhto);
const fileName = new Date().getTime() + '.jpeg';
const savedFile = await Filesystem.writeFile({
path: fileName,
data:base64Data as string,
directory: FilesystemDirectory.Data
});
console.log('saved', savedFile)
if(this.platform.is('hybrid')){
return{
filepath: savedFile.uri,
webviewPath: Capacitor.convertFileSrc(savedFile.uri)
}
}else{
return{
filePath: fileName,
webviewPath: cameraPhto.webPath
}
}
}
private async readAsBase64(cameraPhto:CameraPhoto){
if(this.platform.is('hybrid')){
const file = await Filesystem.readFile({
path:cameraPhto.path as string
});
return file.data;
}else{
//we are on the web
const response = await fetch(cameraPhto.webPath as string);
const blob = await response.blob()
return await this.convertBlobToBase64(blob);
}
}
convertBlobToBase64= (blob: Blob) => new Promise((resolve,reject)=>{
const reader = new FileReader;
reader.onerror = reject;
reader.onload = () =>{
resolve(reader.result);
};
reader.readAsDataURL(blob);
});
}
1条答案
按热度按时间kse8i1jr1#
对于Ionic,您应该导入
IonicStorageModule
以使用服务Storage
根据官方文档https://github.com/ionic-team/ionic-storage,从
import { Storage } from '@ionic/storage-angular';
导入Storage