Using Capacitor to a CRUD an Array

Hi all,

I am trying to get back into coding after not doing some for years since uni so apologies if this is a basic question. I am trying to store arrays of data entered by the user and photos for my expenses app.

From the documentation (https://capacitor.ionicframework.com/docs/apis/storage/) I get you to need to use

async setObject, async getObject() etc. but I am unsure how I feed my array into this. My homepage.ts is copied below. My inputs come from (click) on. I have also added a picture of my code if that’s simpler to read.

Anh help on this at all would be great. I can get it to work for single bits of data but no arrays.

Thanks,

Dave

homepagets1973×1643 292 KB

import { Component } fro`m '@angular/core';`

import { Plugins, CameraResultType, CameraSource } from '@capacitor/core';

import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';

const { Storage} = Plugins;

@Component({

  selector: 'app-home',

  templateUrl: 'home.page.html',

  styleUrls: ['home.page.scss'],

})

export class HomePage {

  Expense_amount: number;

  Expense_reason: string;

  total_exp_start: number = 0;

  result: number =0;

  expList = [];

  newItem;

  Expense;

  dateTime;

  photo: SafeResourceUrl;

add(){

  this.dateTime = new Date();

  this.result += this.Expense_amount;

  this.newItem = this.Expense_reason + '|| Expense Amount:  £' + this.Expense_amount;

  this.expList.push({Expense: 'Expense Reason:  ' + this.newItem + ' ||   Date of Expense: '+ this.dateTime });

   

}

clear(){

  this.Expense_amount = 0;

  this.Expense_reason ="";

}

  constructor(private sanitizer: DomSanitizer) {}

  async takePicture() {

    const image = await Plugins.Camera.getPhoto({

      quality: 100,

      allowEditing: false,

      resultType: CameraResultType.DataUrl,

      source: CameraSource.Camera

    });

  

    this.photo = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl));

  }

  async setItem() {

    const this.expList = JSON.stringify

  await Storage.set({

    key: this.Expense_reason,

    value: this.expList,

  })

  }

}`Preformatted text`

1 post - 1 participant

Read full topic