页面和模态之间的离子2依赖注入

时间:2016-10-27 13:45:51

标签: javascript angular typescript dependency-injection ionic2

我将数据从我的类中传递给我的模态,如下所示。当我在模态视图中触发ChangeCheck()函数时,checkin在我返回MyMap class时不会改变。你知道我怎么能从我的模态中获得它的价值。

@Component({
  selector: 'page-my-map',
  templateUrl: 'my-map.html',
  providers:[CommonVariables]
})

export class MyMap {
  checkin:boolean=false;

constructor(public commonvar:CommonVariables,public modalCtrl: 

ModalController,
public nav:NavController,public alertCtrl:AlertController) {
}

public openBasicModal() {//this functions is triggered once I click the button to open my Modal

    let myModal = this.modalCtrl.create(ModalContentPage,{'myParam':this.checkin});
    myModal.present();
  }

}

@Component({//this is my modal template
  templateUrl:'my-modal.html',
})
export class ModalContentPage {//my modal class
    checkin:boolean;
    constructor(public alertCtrl:AlertController,
    public viewCtrl: ViewController,
    params: NavParams,
    public commonvar:CommonVariables
  ) {
     this.checkin = params.get('myParam');//I am getting this value from MyClass .

  }
      ChangeCheck ( ) {//I trigger this function.but when I close the my modal, it doesn't change the checkin which inside `MyClass`.
                this.checkin = !this.checkin;
}

    dismiss() {
       this.viewCtrl.dismiss();
    }

}

1 个答案:

答案 0 :(得分:1)

您的参数

也缺少public
public params: NavParams

到你的问题:对于cource它不会改变,你必须把它发回去。

将此添加到 ModalController

 let myModal = this.modalCtrl.create(ModalContentPage,{'myParam':this.checkin});

  myModal.onDidDismiss(data => {
     console.log(data);
   });
        myModal.present();

然后在 ModalContentPage

中添加此内容
    dismiss() {
   let data = { 'checkin': this.checkin };
   this.viewCtrl.dismiss(data);
    }