Как установить и получить значения этой формы в локальном хранилище

Question

Я настраиваю локальное хранилище для формы настроек и хочу установить и получить каждое значение этой формы в локальном хранилище моего приложения. Что мне нужно добавить, чтобы сделать набор и получить правильно для этой формы? каждый может видеть, что полученные результаты имеют ошибку, и, возможно, набор сделан неправильно. Как заставить все это работать мне нужно изменить набор и получить методы? Есть ли что-нибудь, что я пропускаю? Я перепробовал все, что знаю, но я новичок в области локального хранения и ионизации.

мой файл ts:

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.min.js"></script>

    import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { FormBuilder, FormGroup, Validators, NgForm, FormControl, ValidatorFn, AbstractControl } from '@angular/forms';
import { ToastController } from 'ionic-angular';
import { EspaceAgentPage } from '../espace-agent/espace-agent';
import { EspaceCitoyenPage } from '../espace-citoyen/espace-citoyen';
import { ChangePasswordPage } from '../change-password/change-password';
import { Storage } from '@ionic/storage';
import { PasswordService } from '../services/password.service';
import { NgModule } from '@angular/core';

@Component({
  selector: 'page-settings',
  templateUrl: 'settings.html',
})
export class SettingsPage {
  private Form : FormGroup;
  public mail: any;
  public tel: any;
  public data: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, public toastCtrl: ToastController, private formBuilder: FormBuilder, public storage: Storage)
  {
    this.Form = formBuilder.group({
      mailadress: ['', Validators.compose([Validators.pattern('^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+.[a-zA-Z0-9-.]+$'),Validators.email])],
      telephone: ['', Validators.compose([ Validators.pattern('[0-9]*'), Validators.minLength(8), Validators.maxLength(8)])],
    });

  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad SettingsPage');
      this.getValue("stoker");
  }

  // set a key/value
  setValue(key: string, value: any)
  {
    this.storage.set(key, value).then((response) => {
      console.log('set' + key + ' ', response);

    }).catch((error) => {
      console.log('set error for ' + key + ' ', error);
    });
  }

  // get a key/value pair
    getValue(key: string) {
      this.storage.get(key).then((val) => {
        console.log('get ' + key + ' ', val);
        this.data[key] = "";
        this.data[key] = val;
      }).catch((error) => {
        console.log('get error for ' + key + '', error);
      });
    }


  onChangepassword()
  {
    this.navCtrl.push(ChangePasswordPage);
  }

  onSubmit(form: NgForm)
  {

    this.mail=this.Form.get('mailadress').value;
    this.tel=this.Form.get('telephone').value;
    console.log(form.value);
    this.setValue("stoker",this.mail);
    this.setValue("stoker",this.tel);

    this.navCtrl.push(EspaceCitoyenPage);
    const toast = this.toastCtrl.create({
      message: 'Modifications Enregistrées !',
      duration: 4000
    });
    toast.present();
  }
}

захват результатов консоли:

захват

Answer 1

Пожалуйста, обратитесь это

import { NativeStorage } from '@ionic-native/native-storage/ngx';

constructor(private nativeStorage: NativeStorage) { }

import { NativeStorage } from '@ionic-native/native-storage/ngx';

constructor(private nativeStorage: NativeStorage) { }
 
this.nativeStorage.setItem('myitem', {property: 'value', anotherProperty: 'anotherValue'})
  .then(
    () => console.log('Stored item!'),
    error => console.error('Error storing item', error)
  );

this.nativeStorage.getItem('myitem')
  .then(
    data => console.log(data),
    error => console.error(error)
  );

this.nativeStorage.setItem('myitem', {property: 'value', anotherProperty: 'anotherValue'})
  .then(
    () => console.log('Stored item!'),
    error => console.error('Error storing item', error)
  );

this.nativeStorage.getItem('myitem')
  .then(
    data => console.log(data),
    error => console.error(error)
  );

Answer 2

localstorage.setitem('your key as your wish',your value),

все значения хранятся в строке ex; -

localstorage.setitem('key', value)
localstorage.getitem('key')

Вы можете использовать

Windows.localstorage.setitem('key', value)

Answer 3

похоже, что вы получаете ошибку в этой функции

// get a key/value pair
getValue(key: string) {
  this.storage.get(key).then((val) => {
    console.log('get ' + key + ' ', val);
    this.data[key] = "";
    this.data[key] = val;
  }).catch((error) => {
    console.log('get error for ' + key + '', error);
  });
}

при попытке получить ключ стокера возвращает нулевую ссылку, а затем ошибку. Возможно, для этого ключа не сохранено ни одного элемента, или при вызове хранилища ладонь не была готова.

Когда вы работаете вокруг хранилища, вы должны ждать от платформы, чтобы быть готовым вот так:

import { Platform } from '@ionic/angular';
import { NativeStorage } from '@ionic-native/native-storage/ngx';

-----

constructor(private storage: NativeStorage, private plt: Platform) {}

  this.plt.ready().then(() => {
     // call native storage
  });

И, думаю, лучше использовать Native Storage, чем ионное хранилище.

Надеюсь, это поможет вам.