web-dev-qa-db-ja.com

ionic2のpopメソッドでパラメーターを渡す方法

Ionic2のPushメソッドでパラメーターを渡してみました。このような

this.nav.Push(SecondPage, {
    thing1: data1,
    thing2: data2
});

しかし、pop（）でパラメーターを渡す方法はありますか。

javascriptangularionic2
14
Akash Rao

Events を使用することをお勧めします。必要なのは、親ページでイベントをサブスクライブし、必要なデータを渡す子でイベントを公開することです。

// taken from the docs
import { Events } from 'ionic-angular';

constructor(public events: Events) {}

// first page (publish an event when a user is created)
function createUser(user) {
  console.log('User created!')
  events.publish('user:created', user);
}

// second page (listen for the user created event)
events.subscribe('user:created', (userEventData) => {
  // userEventData is an array of parameters, so grab our first and only arg
  console.log('Welcome', userEventData[0]);
});
14
akz92

これが私がionic-3でそれを達成した方法であり、簡単に見つけられます。

Pop（）したページ

 this.navCtrl.getPrevious().data.thing1 =data1;
 this.navCtrl.getPrevious().data.thing2 =data2;
 this.navCtrl.pop();

Pop（）の後のページ：

public ionViewWillEnter() {
     this.thing1 = this.navParams.get('thing1')|| null;
     this.thing2 = this.navParams.get('thing2')|| null;
}
14
Prashant

現在、これを達成する方法はないと考えています。

Githubの問題 がありますが、Ionicコアチームによる素晴らしい議論があります。 Ionic 2ロードマップにも追加したようです。 Githubの問題には、ChildPageに行くNavParamsにParentPageを追加するなど、いくつかの回避策が提案されていますが、それはすべてかなりハックです。

2
TheBrockEllis

popTo()の代わりにpop()を使用します

popTo()にはparams?パラメータを次のように渡すことができます。

    this.nav.popTo(SecondPage, {
    thing1: data1,
    thing2: data2
});
1
deanwilliammills

更新：動作するようになったが、それはしない

あるようです| ドキュメントリファレンスを参照 |

pop(opts)は、object型のパラメーターを1つ取ります

そう

一歩戻る

this.nav.pop({
    thing1: data1,
    thing2: data2
});

履歴スタックの特定のビューに移動する

this.nav.popTo(SecondPage, {
    thing1: data1,
    thing2: data2
});

スタックのルートに移動します

this.nav.popToRoot({
    thing1: data1,
    thing2: data2
});

paramsを取得するには（これは動作するはずです。未テスト！）

export class SecondPage{
 constructor(params: NavParams){
   this.params = params;

   console.log(this.params.get('thing1'));
 }
}
1
Ankit Singh

ポップ付きの送信データには、getPrevious（）メソッドを使用できます。

現在のページから離れるとき、前のページを取得してデータを送信する

ionViewWillLeave() {
    this.navCtrl.getPrevious().data.formData = {credentials: {...}};
}

次のページでnavParamsからデータを取得します

ionViewWillEnter() {
    if (this.navParams.get('formData')) {
      // do something
    }
  }
0
rhanesoghlyan

このフォーラムでaaronksaundersに移行するときにコールバックを渡す

https://forum.ionicframework.com/t/solved-ionic2-navcontroller-pop-with-params/58104/4

試してみます。

0
Tzvi Gregory Kaidanov

イオン角型アプリケーションを使用している場合は、ionic-angularイベント

page1.ts

import { Events,NavController } from 'ionic-angular';

export class page1 {

    constructor(private events: Events,
                private nvCtrl: NavController
               ) {}

     goToPage2() {
         this.navCtrl.pop();
         this.event.publish('your-event');
 }

}

page2.ts

import { Events} from 'ionic-angular';

export class page1 {

    constructor(private events: Events,
                private nvCtrl: NavController
               ) {}

     ionViewDidLoad() {
        this.events.subscribe('your-event');
  }

}

0
Aditya