ユーザーがプロファイルで行った編集を保存するのを忘れた場合に備えて、ある種の「エラーチェッカー/検証」を考え出そうとしました。
ユーザーは Profile.htmlを入力し
state
ます。彼らは自分の情報(名前、電話番号など) の一部を更新し始めます。SAVE CHANGES ボタンを押す代わりに、モバイル画面の左上にある SideMenu アイコンをクリックして、プロファイル状態から移動します。フォームは技術的には "
$dirty
" であると見なすようになりました。最初はこの角度プロパティを使用しようとしましたが、実際に必要な結果を得ることができなかったので、$watch
..
ProfileController.js
$rootScope.isFormDirty = false;//global variable 'isFormDirty'->inject in controller.js (toggleLeftSideMenu())
$scope.$watch('updateDriverProfileInfo', function(newValue, oldValue) {//new & oldValue = ng-model when form is 1st 'viewed' is dirty
//http://tutorials.jenkov.com/angularjs/watch-digest-apply.html
if (newValue !== oldValue) {
// console.log("updatingg")
$rootScope.isFormDirty = true;
}
}, true);
考えてみると、これのためにファクトリーまたはサービスを作成する必要があるかもしれませんが、当時は、このコントローラーで$rootScope
グローバル変数を設定しisFormDirty
、この Ionic でサイドメニューのロジックを保持するジェネラルコントローラーで使用できるように使用していました。アプリ。
controller.js (これは、SideMenu のコントローラーがある場所です)
$scope.sidemenuIsOpen = false;
$scope.toggleLeftSideMenu = function() {//ng-click from menu.html
$scope.sidemenuIsOpen = !$scope.sidemenuIsOpen;
if ($scope.sidemenuIsOpen && $rootScope.isFormDirty) {
var confirmPopup = $ionicPopup.confirm({
title: 'Changes were not saved',
template: 'Do you want to save your changes?',
});
confirmPopup.then(function(res) {
if (res) {
console.log('Run updateDriverProfile()');
} else {
console.log('Allow user to continue w/o changes');
}
});
}
};
それは基本的に私のコードの要点です。実際には「機能します」が、パターンを特定しました。これを達成するためのまったく異なる方法、またはこの現在のコードのリファクタリングのヒントを提案するために、あなたの支援が必要な場所です。
- ユーザーがサイドメニューボタンをクリックするとポップアップが表示されますが、フォームが $dirty であるかどうかは問題ではないと思います..
より大きな問題は、profile.html ビューまたはその他のビューを離れようとしているかどうかに関係なく、ポップアップが表示され始めることです。
このコードを書いたとき、オブジェクトを「監視」しているため、ポップアップとtoggleLeftSideMenu
関数はプロファイル ビューでのみ機能するという印象を受けましたupdateDriverProfileInfo
。また、メニュー コントローラーとプロファイル コントローラーの間で使用するグローバル変数も作成しました。