如何自定義ngDialog的關閉對話框功能？

我必須實現自定義關閉對話框功能關閉按鈕ngDialog。如何自定義ngDialog的關閉對話框功能？

根據需要在某些情況下（有一個表單）我必須顯示另一個ngDialog確認彈出詢問用戶是否真的要關閉對話框或沒有，所以有2個選項'是'和'沒有'有這種行爲。

我試過用preCloseCallback()的方法，但不知何故它沒有爲我工作，因爲它不等待用戶確認。它就像在關閉點擊時調用的函數一樣，對話框關閉或保持打開，這取決於我立即從函數返回的內容。如果我沒有返回任何東西，它會認爲它是真實的並關閉對話框。

任何人都可以請讓我知道解決這個問題的方法嗎？

來源

2017-08-14 Code Spark

這裏有很好的解決方案！這有點哈克，但爲我的情況完美工作。

步驟1

設置showClose選項在打開的對話框假。

// In controller 
PopUpFactory.openModal('SOME_NAME','SOME_URL.html', 'ngdialog-theme-default SOME_EXTRA_CSS', $scope, function(value){ 
    console.log("Done:", value); 
},'SOME_CONTROLLER',false); // false passes to set **showClose** option false 

// In common Factory 
function openModal(name, templateUrl, classes, scope, callback, ctrl, showClose){ 
    if(showClose === undefined){ 
     showClose = true; 
    } 
    ngDialog.openConfirm({ 
     name: name, 
     controller: ctrl, 
     template: templateUrl, 
     className: classes, 
     closeByDocument: false, // to prevent popup close by clicking outside 
     closeByEscape: false, // to prevent popup close by ESC key 
     closeByNavigation : true, // to close popup on state navigation 
     scope: scope, 
     disableAnimation: true, 
     showClose: showClose, 
     preCloseCallback: function(value) { 
      return true; 
     } 
    }).then(function (value) { 
     callback(value); 
    }); 
}

步驟2

寫入共同關閉按鈕處理功能

// In Common Factory 
/** 
* Customize close for any open modal form 
* @param isDirty - flag saying if form is dirty 
* @param $scope - scope object of current open form 
* @param $event - $event object passed from close button of open form 
*/ 
var closeConfirmOpen = false; 
function closeForm(isDirty,$scope,$event){ 
    // following lines are important to prevent default behavior of ngDialog close event 
    if($event){ 
     $event.preventDefault(); 
     $event.stopPropagation(); 
    } 

    if(isDirty){ 
     var msg = $filter('translate')('navigateAwayWithoutSavingConfirmMsg'); 
     closeConfirmOpen = true; 
     confirmPopUp('Warning', msg, null, 'leavePage', 'red', 'stayOnPage', function(isOK){ 
      if(isOK == 1){ 
       $scope.closeThisDialog(); 
      } 
      closeConfirmOpen = false; 
     }); 
    }else{ 
     $scope.closeThisDialog(); 
    } 
}

步驟3

寫關閉功能在控制器調用工廠函數

/** 
* Close sample location modal 
*/ 
$scope.closeForm = function($event){ 
    PopUpFactory.closeForm($scope.formName.$dirty,$scope,$event); 
}

步驟4

添加以下定義頁眉/標題HTML ngDialog

<div id="SOME_ID" class="ngdialog-close" ng-click="closeForm($event)"></div>

Yooo ...的工作做好......後線！

這個解決方案的最好的部分是用於關閉任何形式的公共代碼，所以一旦你的工廠函數來完成，你只需要在任何地方需要添加關閉按鈕，在HTML和控制器

添加簡單的關閉功能

來源

2017-08-14 15:36:48

如何自定義ngDialog的關閉對話框功能？

回答

相關問題