質問するログイン新規登録

Q&A

解決済

1回答

3007閲覧

モーダルを開いて戻って来た時にページを更新する方法

fufufu000

総合スコア29

Ionic

Ionicは、クロスプラットフォームに対応したモバイルアプリ開発のためのオープンソースUIフレームワークです。iOSやAndroid、Webのアプリケーションを1つのコードベースで開発できます。

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

0グッド

0クリップ

投稿2020/07/11 08:42

編集NaN/aN/aN aN:aN

0

0

ページを更新したい!

モーダルで行ったアクションをページに反映させたいのですが、
モーダルページを消しただけでは更新にならず困っています。

そのページを開き直せば、更新されているので、アクション的には問題ないことは確認済みです。

やってみたこと

ionicのページライフサイクルを参考に試してみたのですが、どれも読み込まれませんでした。

** 何か良い方法があれば教えて欲しいです!!
よろしくお願いします!! **

コード

page抜粋

html

1{{modalActionDisplay}}

typescript

1 async presentModal() { 2 const modal = await this.modalController.create({ 3 component: ModalPage, 4 cssClass: 'my-custom-class' 5 }); 6 await modal.present(); 7 } 8} 9 10ngOnInit(){ 11 this.storage.get('test').then(async (val) => { 12 this.modalActionDisplay = val 13 } 14 }

modal page 抜粋

typescript

1this.storage.set('test',true) 2modal.dismiess();

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

guest

回答1

0

ベストアンサー

onDidDismissメソッドがあるので、それでモーダルを閉じるイベントを取得してください。

const modal = await this.modalController.create({ component: ModalPage, cssClass: 'my-custom-class', swipeToClose: true, presentingElement: this.routerOutlet.nativeEl }); await modal.present(); await modal.onDidDismiss(); // Modalが閉じるまで待機 // ここにModalを閉じたあとのイベントを書く

https://ionicframework.com/jp/docs/api/modal

投稿2020/07/13 02:00

rdlabo

総合スコア448

fufufu000

2020/07/13 03:00

ありがとうございます! 丁寧なコードとURLのお陰で解決しました!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.25%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問