How to take localstorage value inside constructor for processing?

Ionic Framework ionic-v3
1

Friends,
I have a form with some FormGroup values . I need to take some localstorage value and process inside constructor as shown in code :

constructor(public navCtrl: NavController, public navParams: NavParams,public http: HttpClient,public formbuilder: FormBuilder,public propertyProvider: PropertyProvider, public gosearch: GoserviceProvider, private storage: Storage ) {

   
     //checking for storage ready
      this.storage.ready().then(async (lf) => {
         //getting the value asyncrone, check the async in the inner function declaration
          //let lbid = await lf.getItem('LBID');
          this.lbid = await lf.getItem('LBID');
          this.lbname = await lf.getItem('lbname');
          this.tnyLBCategory = await lf.getItem('tnyLBCategory');
          this.lbtype = await lf.getItem('lbtype');
          this.distid = await lf.getItem('distid');
          //this.lbid = 172; //-- Tested value

          //this.distid = 1; //-- Tested Value
          this.lbtype = 3; // for municipality -- Tested value
          this.data.result = '';
   if(this.lbtype == 5){
     this.getZonalOffice(this.lbid,this.lbtype); // calling api zonal office ...
     this.getAssessmentYear(this.lbid); // calling api ward year...
     
     this.formgroup = formbuilder.group({
       zonaloffice:['',Validators.required],
       wardyear:['',Validators.required],
       wardnumber: ['',Validators.required],
       doornumber: ['',Validators.required],
       subnumber: ['']
     });
     this.zonaloffice = this.formgroup.controls['zonaloffice'];
     this.wardyear = this.formgroup.controls['wardyear'];
     this.wardnumber = this.formgroup.controls['wardnumber'];
     this.doornumber = this.formgroup.controls['doornumber'];
     this.subnumber = this.formgroup.controls['subnumber'];
     this.data.zonaloffice = '';
     this.data.wardyear = '';
     this.data.wardnumber = '';
     this.data.doornumber = '';
     this.data.subnumber = '';
   }
   if(this.lbtype == 3){ // for municipality
     this.getZonalOffice(this.lbid,this.lbtype);
     this.getAssessmentYear(this.lbid);
     this.formgroup = formbuilder.group({
       zonaloffice:['',Validators.required],
       wardyear:['',Validators.required],
       wardnumber: ['',Validators.required],
       doornumber: ['',Validators.required],
       subnumber: ['']
     });
     this.zonaloffice = this.formgroup.controls['zonaloffice'];
     this.wardyear = this.formgroup.controls['wardyear'];
     this.wardnumber = this.formgroup.controls['wardnumber'];
     this.doornumber = this.formgroup.controls['doornumber'];
     this.subnumber = this.formgroup.controls['subnumber'];
     this.data.zonaloffice = '';
     this.data.wardyear = '';
     this.data.wardnumber = '';
     this.data.doornumber = '';
     this.data.subnumber = '';
   }
   if(this.lbtype == 4){
     this.getZonalOffice(this.lbid,this.lbtype);
     this.getAssessmentYear(this.lbid);
     this.formgroup = formbuilder.group({
       zonaloffice:['',Validators.required],
       wardyear:['',Validators.required],
       wardnumber: ['',Validators.required],
       doornumber: ['',Validators.required],
       subnumber: ['']
     });
     this.zonaloffice = this.formgroup.controls['zonaloffice'];
     this.wardyear = this.formgroup.controls['wardyear'];
     this.wardnumber = this.formgroup.controls['wardnumber'];
     this.doornumber = this.formgroup.controls['doornumber'];
     this.subnumber = this.formgroup.controls['subnumber'];
     
     this.data.zonaloffice = '';
     this.data.wardyear = '0';
     this.data.wardnumber = '';
     this.data.doornumber = '';
     this.data.subnumber = '';
   }
 });
 }

but i got errors as

  1. ERROR Error: formGroup expects a FormGroup instance. Please pass one in.
  1. ERROR CONTEXT Object { view: Object, nodeIndex: 4, nodeDef: Object, elDef: Object, elView: Object }
  1. ERROR TypeError: this.form is undefined
  1. ERROR CONTEXT Object { view: Object, nodeIndex: 33, nodeDef: Object, elDef: Object, elView: Object } PropertyTaxPage.ngfactory.js

Please any body advise how this can done for me in proper way

Thanks

Anes

2

Hi,

Simply use the form input, but BEFORE you try to store something with this.storage.ready…

declare all values before, test it with FormGroup & Validators, etc…

And once done, SEND the values.

You’re near in terms of ionic/serve app, continue the work it’s good :slight_smile:

3

Do you please rewrite my code as you suggest … without that local storage redy code my code works fine with ‘hard coded data’ with

//this.lbid = 172; //-- Tested value

//this.distid = 1; //-- Tested Value

//this.lbtype = 3; // for municipality – Tested value

But my need is take them from my setting (local storage) value. That values already set in settings page .

please do some code help

Thanks

Anes

4

@anespa I learn javascript everyday (even old school), it means you can use return on any function if it doesn’t work. That changed my way of returning in my app.

5

Ok there’s things i don’t quite get from your code, i see all instances you pass to the form variable uses exactly the same input, empty strings with required validator, is that in progress? because if not, you could move one of those to the top of the constructor & delete the others (for starters).

Anyway your bug is very likely to be that you don’t pass an initial form, i see like many of the operations in there are async, which means you get the value afterwards, if you leave it like that the app breaks because you didn’t assigned anything to the form variable at start, what’s Angular supposed to do with the variable when it runs CD and the form variable is empty?.