There's an issue with my object - it initially gets key values, but then suddenly loses them all.
All the key values become empty and a message appears in the console for the object: "this value was evaluated upon first expanding. it may have changed since then", even though I haven't changed its value elsewhere.
This is what my service looks like:
image = {
name: "",
path: "",
data: ""
};
async loadFileData(fileNames: string[]) {
for (let f of fileNames) {
const filePath = `${IMAGE_DIR}/${f}`;
const readFile = await Filesystem.readFile({
directory: Directory.Data,
path: filePath
});
this.images.push({
name: f,
path: filePath,
data: `data:image/jpeg;base64,${readFile.data}`
});
// testing
this.image.name = f;
this.image.path = filePath;
this.image.data = `data:image/jpeg;base64,${readFile.data}`;
}
console.log('my image: ', this.image);
}
async loadFiles() {
this.images = [];
const loading = await this.loadingController.create({
message: 'loading data...',
});
await loading.present();
Filesystem.readdir({
directory: Directory.Data,
path: IMAGE_DIR
}).then(result => {
this.loadFileData(result.files);
}, async err => {
console.log('err: ', err);
await Filesystem.mkdir({
directory: Directory.Data,
path: IMAGE_DIR
});
}).then(_ => {
loading.dismiss();
});
}
This is how my component is set up:
this.photoService.loadFiles();
console.log('my object: ', this.photoService.image);
console.log('is my object empty? ', JSON.stringify(this.photoService.image) === '{}');