2017-03-09 18 views
3

こんにちは私のデバイスビューからデータを私のModal(デバイス詳細ビュー)に渡して、それを私のModalにバインドしようとしています。(click)=openModal() modalはparamで開きます。クリックした。残念ながらそれはまだ誰も私がそれを処理することができるアイデアを空にする?Modal ionicにデータを渡す方法2

//データソース&モーダルハンドラ

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); 
    } 

}; 

//と私の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); 
    } 

} 

答えて

19

イオンv3ではモーダルコントローラでデータを渡すためのプロセスとデータを渡すと異なっているがNavコントローラ。主な違いは、キーと値でデータを渡すことです。

let modal = this.modalCtrl.create(ModalPage, {deviceNum: deviceNum});

とあなたのモーダルコンストラクタに:

constructor(public platform: Platform, params: NavParams,public viewCtrl: ViewController) { 
    console.log(params.get('deviceNum')); 
} 
+0

@Alex:

あなたがこれを行う必要があり、あなたのモーダルコントローラでNavParamsをインポートしたのですか? https://ionicframework.com/docs/v2/api/navigation/NavParams/ここに例があります。実際はhttps://ionicframework.com/docs/v2/api/components/modal/ModalControllerです。/ – briosheje

+0

[link](http://dpaste.com/2K88YMM)はいそれはincideです – Alex

+0

@Alexandreあなたはまだそれが未定義である理由を知っていますか? :(上のリンクで私は私のdpasteを投稿しました – Alex

関連する問題