Get Items from a QR-Code

Ionic Framework Ionic Angular
6

You made another topic involving Storage. Please take Storage totally out of the equation here, at least for now, if possible. If that isn’t possible, then read this post and rearchitect your code to follow it.

Specifically, only one read from Storage, at service construction / app launch. Do NOT read from Storage at any other time during ordinary app execution.

OK, now that that’s done, let’s assume you have a service that looks like this:

interface Thingy { ... }
class ThingyService {
  private thingies$ = new BehaviorSubject<Thingy[]>([]);
  watchThingies(): Observable<Thingy[]> { return this.thingies$; }
  peekThingies(): Thingy[] { return this.thingies$.value; }
  pokeThingies(thingies: Thingy[]): void { this.thingies$.next(thingies); }
  clearThingies(): void { this.pokeThingies([]); }
  addThingy(thingy: Thingy): void { 
    let nt = [...this.peekThingies()]; 
    nt.push(thingy); 
    this.pokeThingies(nt); 
  }
}

In your page, inject this service, call watchThingies at page construction, use @ngneat/until-destroy to manage the subscription to it, assign every new emission to a Thingy[] property in the page, and use ngFor to step through that property in the template. To add new codes, scan the QR and call addThingy with the result.