Form inside modal returning undefined

Ionic Framework ionic-v3
1

Hello!
–v2
I am trying to create a simple form inside a modal that takes the information the user entered and displays it in the previous page. I have called the form: addform and the home page: mhome.

My form calls the closeModal() function:

export class Addform {
  private addform : FormGroup;

  constructor(private formBuilder: FormBuilder, public storage: Storage,public navCtrl: NavController, public viewCtrl: ViewController) {
    this.addform = this.formBuilder.group({
      name: ['', Validators.required],
      occupation: [''],
      dob: [''],
      relationship: [''],
        color: [''],
      adjectives: [''],

    });

  }
  closeModal(){
  //  this.navCtrl.push(MhomePage,this.addform);
  // console.log();
  // let data = this.addform;
 **let data = this.addform;** //This is the part I'm confused on. How do I set the formbuilder group variables to the data variable?
  this.viewCtrl.dismiss();

  }

The openModal() function

  openModal() {

     let modal = this.modalCtrl.create(Addform);
     modal.onDidDismiss((data) => {
        console.log("Data =>", data);
     });
     modal.present();

  }

Hitting the + button pops open the form page. The console shows that the data is undefined.

image
Screen Shot 2017-07-02 at 8.46.21 PM.png1328×1086 81 KB

Any help would be appreciated!

2

Demonstrated here.

3

Thanks for that. How would I access each individual component in the form builder group though?
In the example that they show, they have the user id already set.

let profileModal = this.modalCtrl.create(Profile, { userId: 8675309 });

//So they can then pass it along and do things with the user id

 let modal = this.modalCtrl.create(Addform, addform.name( I know this part is wrong) );

how would I access the value the user entered in the formbuilder group to pass it to the modal?

Sorry if this seems obvious!