After saving, ionic storage does not rebind the values. Capacitor/Ionic 6


I’m storing and retrieving values with the Ionic storage plugin. I have a settings page from which the user can select. The app settings are accessible throughout the app.

This is my

  <ion-toolbar class="app-theme-color">
    <ion-buttons slot="start">

          <ion-select [(ngModel)]="currencyChoice">
            <ion-select-option [value]="currencyChoice">Dollars</ion-select-option>
            <ion-select-option [value]="currencyChoice">Euros</ion-select-option>
            <ion-select-option [value]="currencyChoice">Pounds</ion-select-option>
          <ion-select [(ngModel)]="unitChoice">
            <ion-select-option [value]="unitChoice">Kilometers</ion-select-option>
            <ion-select-option [value]="unitChoice">Miles</ion-select-option>
  <ion-button (click)="setConfig()">Save</ion-button>

I use a select box from which the user can select.

This is my file:

import { Component, OnInit } from '@angular/core';
import { Storage } from '@ionic/storage-angular';

  selector: 'app-settings',
  templateUrl: './',
  styleUrls: ['./'],
export class SettingsPage implements OnInit {


  constructor(private storage: Storage) {

  ngOnInit() {

  async init() {

  setConfig() {'currencyChoice', this.currencyChoice);'unitChoice', this.unitChoice);

  getConfig() {

    this.currencyChoice ='currencyChoice').then((data) => {
      console.log(data, "init");

    this.unitChoice ='unitChoice').then((data) => {
      console.log(data, "init");

When I select a value, the selected value appears in the console. When I restart the page, the selected values are visible in my console but not in the UI.

I have use this tutorial:

And this is the plugin I use:


Save – Works
Getting the saved values – Works
Seeing the saved values in the UI – Not working

How can I see the selected value in de ion-select component?


you are saving the promise, not the value. change your getConfig function to this:'currencyChoice').then((data) => {
      console.log(data, "init");
      this.currencyChoice = data;
    });'unitChoice').then((data) => {
      console.log(data, "init");
      this.unitChoice = data;

Answered By – AmirAli Saghaei

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published