編集中に詳細を保存せずにルートを変更するようにユーザーに確認する

ユーザーが何かを編集していて、詳細を保存せずにルートを変更しようとしている場合。編集中に詳細を保存せずにルートを変更するようにユーザーに確認する

この状態で、「あなたの変更は保存されていませんか？」というユーザーを変更したいと思います。ユーザーがコンポーネントにコンポーネントを破壊するのを防ぐことができますに応じて。

私はガードを試みますが、ngOnDestroyメソッドを実行する前にガードを実行します。どうすればいいですか？

2017-06-05 Er Sushil

？ボタンをクリックしますか？ – Thiagz

@Thiagzルートは、ヘッダーコンポーネントのナビゲーションバーまたはブラウザの戻るまたは進むボタンから変更できます。ユーザーが詳細を確認したり、コンポーネントの任意のフォームに保存したりしないようにするには、ユーザーにナビゲートまたは破棄する必要はありません。 –

onclickイベントを使用して必要なメッセージをトリガーしないのはなぜですか？ – Thiagz

私はCanDeactivateを同じ機能のために使用しており、うまく機能しています。

出典

2017-06-05 07:45:08

複数のコンポーネントについて説明できますか？ –

これを実装するすべてのルートに対して、[YourDeactivateGuard]を追加して、CanDeactivateするだけです。あなたのCanDeactivateGuardではこのような何か： '@Injectableを（）エクスポートクラスDeactivateGuardはCanDeactivate { canDeactivate（コンポーネント：任意の）を実装{ //戻り値がTrueまたは条件あたりの偽}がtrueを返す。 } } ' –

火災は一度だけ防御します。子供の親Gaurdへのナビゲート中に –

トリガーNavigationStart現在のルートを離れる前に仕事をするルータ。

constructor(private router: Router) { 
    .. 
    this.router.events.forEach((e: any) => { 
    if (e instanceof NavigationStart) { 
     // do confirm here. 
    } 
    }); 
}

出典

2017-06-05 07:50:01 Pengyy

この目的で角度CanDeactivateを使用できます。またcanDeactivate角度

https://angular.io/docs/js/latest/api/router/index/CanDeactivate-interface.html https://blog.thoughtram.io/angular/2016/07/18/guards-in-angular-2.html

の

リンク https://rahulrsingh09.github.io/AngularConcepts/

AdvancedConcepts @作業例 - >ガードルート変更を行う方法

出典

2017-06-05 08:01:16

ブラウザの戻るボタンをクリックするとGaurdが機能しません。 –

試しているコードまたは同じコードを表示できますか？ –

'エクスポートクラスEditorGuardがCanDeactivate { コンストラクタ（プライベートcustomEmitterService：CustomEmitterService）を実装{} canDeactivate（成分：任意、currentRoute：ActivatedRouteSnapshot、currentStateの：RouterStateSnapshot）{ IF（this.customEmitterService.isEditing）{ LET確認：ブール= window.confirm（ 'text'）; if（確認）{ this.customEmitterService。isEditing = false; trueを返します } else { falseを返します。 } } else { return true; } } } 'ここで –

編集中に詳細を保存せずにルートを変更するようにユーザーに確認する

答えて

関連する問題