Javascript 如何将数据传递给 Modal ionic 2
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/42694429/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to pass data to Modal ionic 2
提问by Alex
Hello guys Im trying to pass data from my device View to my Modal(device detail View) and bind it to my Modal so if i do (click)=openModal()the modal should open with the param which i clicked on. but unfortunately it still empty anybody an idea how i can handle it?
大家好我正在尝试将数据从我的设备视图传递到我的模态（设备详细信息视图）并将其绑定到我的模态，所以如果我这样做(click)=openModal()，模态应该用我点击的参数打开。但不幸的是，它仍然让任何人都知道我如何处理它？
// Data source & Modal handler
// 数据源和模态处理程序
import { Component } from '@angular/core';
import { ModalController, Platform, NavParams, ViewController,NavController } from 'ionic-angular';
import { ModalPage } from '../modal/modal';
@Component({
selector: 'page-deviceslist',
templateUrl: 'devicelist.html'
})
export class DevicesListPage {
devices;
device;
constructor(
public modalCtrl: ModalController,
public nav: NavController,
public params: NavParams,
) {
this.devices = [
{
title: 'Küche',
items: [
{title: 'KüchenAid', consumption:'32 W', checked:'true'},
{title: 'Thermomix', consumption:'0 W', checked:'false'}
]
},
{
title: 'Wohnzimmer',
items: [
{title: 'Fernseher',consumption:'0 W', checked:'false'},
{title: 'Stehlampe',consumption:'60 W', checked:'true'},
]
}
];
this.device = this.devices[this.params.get('devNum')];
}
openModal(deviceNum) {
let modal = this.modalCtrl.create(ModalPage, deviceNum);
modal.present();
console.log(this.device);
console.log(this.devices);
}
};
//and my modal.ts
//和我的modal.ts
import { Component } from '@angular/core';
import { ModalController, Platform, NavParams, ViewController } from 'ionic-angular';
@Component({
selector: 'page-modal',
templateUrl: 'modal.html'
})
export class ModalPage {
constructor(
public platform: Platform,
public params: NavParams,
public viewCtrl: ViewController
) {
}
dismiss(data) {
this.viewCtrl.dismiss(data);
}
}
回答by Alexandre Justino
The process to pass data with the Modal Controller in Ionic v3 is different from passing data with the Nav Controller. The main difference is that you pass data with a key and value.
在 Ionic v3 中使用 Modal Controller 传递数据的过程与使用 Nav Controller 传递数据的过程不同。主要区别在于您使用键和值传递数据。
You should do this:
你应该做这个：
let modal = this.modalCtrl.create(ModalPage, {deviceNum: deviceNum});
let modal = this.modalCtrl.create(ModalPage, {deviceNum: deviceNum});
and on your modal constructor:
并在您的模态构造函数上：
constructor(public platform: Platform, params: NavParams,public viewCtrl: ViewController) {
console.log(params.get('deviceNum'));
}
